1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
| tinymce.init({
selector: '#content',//绑定渲染区
height: 600,
plugins: 'paste importcss code table advlist fullscreen imagetools textcolor colorpicker hr autolink link image lists preview media wordcount',
toolbar: 'styleselect | formatselect | fontsizeselect | forecolor backcolor | bold italic underline strikethrough | image media | table | alignleft aligncenter alignright alignjustify | outdent indent | numlist bullist | preview removeformat hr | paste code link | undo redo | fullscreen',
skin: 'oxide',
language: 'zh_CN',//汉化
convert_urls: false,
// relative_urls : true,
images_upload_url: '../tmmedia/upload',//图片上传地址
images_upload_credentials: true,
image_dimensions: false,
image_class_list: [
{title: '无', value: ''},
{title: '预览', value: 'preview'},
],
// images_upload_base_path: '/',
forced_root_block: 'p',
force_p_newlines: true,
importcss_append: true,
content_style: `
* { padding:0; margin:0; }
html, body { height:100%; }
img { max-width:100%; display:block;height:auto; }
a { text-decoration: none; }
iframe { width: 100%; }
p { line-height:1.6; margin: 0px; }
table { word-wrap:break-word; word-break:break-all; max-width:100%; border:none; border-color:#999; }
.mce-object-iframe { width:100%; box-sizing:border-box; margin:0; padding:0; }
ul,ol { list-style-position:inside; }
`,
insert_button_items: 'image link | inserttable',
// CONFIG: Paste
paste_retain_style_properties: 'all',
paste_word_valid_elements: '*[*]', // word需要它
paste_data_images: true, // 粘贴的同时能把内容里的图片自动上传
paste_convert_word_fake_lists: false, // 插入word文档需要该属性
paste_webkit_styles: 'all',
paste_merge_formats: true,
nonbreaking_force_tab: false,
paste_auto_cleanup_on_paste: false,
// CONFIG: Font
fontsize_formats: '10px 11px 12px 14px 16px 18px 20px 24px',
// CONFIG: StyleSelect
style_formats: [
{
title: '首行缩进',
block: 'p',
styles: {'text-indent': '2em'}
},
{
title: '行高',
items: [
{title: '1', styles: {'line-height': '1'}, inline: 'span'},
{title: '1.5', styles: {'line-height': '1.5'}, inline: 'span'},
{title: '2', styles: {'line-height': '2'}, inline: 'span'},
{title: '2.5', styles: {'line-height': '2.5'}, inline: 'span'},
{title: '3', styles: {'line-height': '3'}, inline: 'span'}
]
}
],
// Tab
tabfocus_elements: ':prev,:next',
object_resizing: true,
// Image
imagetools_toolbar: 'rotateleft rotateright | flipv fliph | editimage imageoptions',
file_picker_types: 'media',
media_live_embeds: true,
//be used to add custom file picker to those dialogs that have it.
file_picker_callback: function (cb, value, meta) {
if (meta.filetype == 'media') {
//创建一个隐藏的type=file的文件选择input
let input = document.createElement('input');
input.setAttribute('type', 'file');
input.onchange = function(){
let file = this.files[0];//只选取第一个文件。如果要选取全部，后面注意做修改
let xhr, formData;
xhr = new XMLHttpRequest();
xhr.open('POST', '../tmmedia/upload');//自定义文件上传
xhr.withCredentials = true;
xhr.upload.onprogress = function (e) {
// 进度(e.loaded / e.total * 100)
};
xhr.onerror = function () {
console.log(xhr.status);
return;
};
xhr.onload = function () {
let json;
if (xhr.status < 200 || xhr.status >= 300) {
console.log('HTTP 错误: ' + xhr.status);
return;
}
json = JSON.parse(xhr.responseText);
console.log(json)
//接口返回的文件保存地址
let mediaLocation=json.location;
//cb()回调函数，将mediaLocation显示在弹框输入框中
cb(mediaLocation, { title: file.name });
};
formData = new FormData();
//假设接口接收参数为file,值为选中的文件
formData.append('file', file);
//正式使用将下面被注释的内容恢复
xhr.send(formData);
}
//触发点击
input.click();
}
}
});
|
