《TinyMCE汉化及本地上传图片功能实例详解_.docx》由会员分享，可在线阅读，更多相关《TinyMCE汉化及本地上传图片功能实例详解_.docx（9页珍藏版）》请在三一文库上搜索。
1、TinyMCE汉化及本地上传图片功能实例详解_ 这篇文章主要介绍了TinyMCE汉化及本地上传图片功能实例详解的相关资料,由于我们下载下拉的是英文版，需要先汉化，比较简洁，需要的伴侣可以参考下 TinyMCE我就不多介绍了，这是下载地址：https:/ 下载下来是英文版，要汉化也很简洁。 首先去网上任凭下载个汉化包，然后把汉化包解压后的langs文件夹里的zh_CN.js拷到你下载的TinyMCE的langs文件夹中就行。最终在 tinymce.init中加上”language: zh_CN，（后面会贴出代码） 本地图片上传我用到了Jquery中的uploadify和UI,所以需要引用jque
2、ry.uploadify.min.js和jquery-ui.js Jquery中uploadify有基于flash和基于HTML两个版本，后者是要$5。这个，我还是用的基于flash的。 那么还需要添加swfobject.js引用。这些引用的下载就不贴了，网上许多许多。 基本介绍完了，下面挺直看代码： 代码如下: style type=text/css .mceuploadify display:block; /style link rel=stylesheet href=Url.Content(/uploadify/uploadify.css)/ script type=text/javas
3、cript src=Url.Content(/Content/js/history.js)/script script type=text/javascript src=Url.Content(/tinymce_4.3.12/tinymce/js/tinymce/tinymce.min.js)/script script type=text/javascript src=Url.Content(/Scripts/jquery-1.4.4.min.js)/script script type=text/javascript src=Url.Content(/Scripts/jquery-ui.j
4、s)/script script type=text/javascript src=Url.Content(/uploadify/jquery.uploadify.min.js)/script script type=text/javascript src=Url.Content(/uploadify/swfobject.js)/script script type=text/javascript $(document).ready(function () var tinymceEditor; tinymce.init( selector: textarea#Content, auto_foc
5、us: Content, language: zh_CN, theme: modern, plugins: advlist autolink lists link image charmap preview, searchreplace visualblocks fullscreen, insertdatetime media table contextmenu paste, emoticons textcolor , toolbar1: undo redo | styleselect | fontselect | fontsizeselect | bold italic underline
6、strikethrough | alignleft aligncenter alignright alignjustify | bullist numlist outdent indent, toolbar2: fullscreen preview | forecolor backcolor emoticons | table | link image media | mybutton, setup: function (editor) editor.addButton(mybutton, text: 上传图片, icon: false, onclick: function () tinymc
7、eEditor = editor; $(#uploadofedit).dialog( modal: false, resizable: false, width: 400, height: 200, dialogClass: mceuploadify ); ); , /TinyMCE 会将全部的 font 元素转换成 span 元素 convert_fonts_to_spans: true, /换行符会被转换成 br 元素 convert_newlines_to_brs: false, /在换行处 TinyMCE 会用 BR 元素而不是插入段落 force_br_newlines: false
8、, /当返回或进入 Mozilla/Firefox 时，这个选项可以打开/关闭段落的建立 force_p_newlines: false, /这个选项掌握是否将换行符从输出的 HTML 中去除。选项默认打开，由于很多服务端系统将换行转换成 br /，由于文本是在无格式的 textarea 中输入的。用法这个选项可以让全部内容在同一行。 remove_linebreaks: false, /不能把这个设置去掉，不然图片路径会出错 relative_urls: false, /不允许拖动大小 resize: false, font_formats: 宋体=宋体;黑体=黑体;仿宋=仿宋;楷体=楷体;
9、隶书=隶书;幼圆=幼圆;Arial=arial,helvetica,sans-serif;Comic Sans MS=comic sans ms,sans-serif;Courier New=courier new,courier;Tahoma=tahoma,arial,helvetica,sans-serif;Times New Roman=times new roman,times;Verdana=verdana,geneva;Webdings=webdings;Wingdings=wingdings,zapf dingbats, fontsize_formats: 8pt 10pt 12
10、pt 14pt 18pt 24pt 36pt ); $(#tinymceuploadify).uploadify( swf: /uploadify/uploadify.swf, buttonText: 上传本地图片, uploader: /Home/Upload, auto: true, fileTypeExts: *.gif; *.jpg; *.png, method: post, multi: false, onUploadSuccess: function (event, data, flag) var img = img src=./././UploadImg/ + data + ;
11、tinymceEditor.insertContent(img); setTimeout(function () $(#uploadofedit).dialog(close); , 1000); , onUploadError: function () setTimeout(function () $(#uploadofedit).dialog(close); , 1000); alert(上传失败); ); ); /script div form method=post action=/Home/ textarea id=content name=content style=width: 1
12、00%; height: 600px;/textarea input type=submit value=提交 / /form /div div id=uploadofedit style=display: none; input type=file name=tinymceuploadify id=tinymceuploadify / label只能上传单张10M以下的 png、jpg、gif 格式的图片/label /div 说明： $(#tinymceuploadify).uploadify( swf: /uploadify/uploadify.swf, buttonText: 上传本地
13、图片, uploader: /Home/Upload, auto: true, fileTypeExts: *.gif; *.jpg; *.png, method: post, multi: false, onUploadSuccess: function (event, data, flag) var img = img src=./././UploadImg/ + data + ; tinymceEditor.insertContent(img); setTimeout(function () $(#uploadofedit).dialog(close); , 1000); , onUploadError: function () setTimeout(function () $(#uploadofedit).dialog(close); , 1000); alert(上传失败); ); 这段代码中的参数，如swf,uploader,fileTypeExts这几个重要的参数得依据自己下载的jquery.uploadify.js的版原来确定。具体可以去看正式的说明文档。 以上所述是我给大家介绍的TinyMCE汉化及本地上传图片功能实例详解，盼望对大家有所关心 .