ueditor去掉上传功能_文件上传插件 ueditor 独立上传功能

找了许多文件上传插件，有的会影响自己的样式，有的用起来太复杂，有的浏览器兼容性太差。研究了一阵子百度家的ueditor，发现他家富文本里面的文件上传样式挺好看，于是整理了一下使用方法。插件的配置、引入，就不多说了，官网文档都有，下面介绍如何独立出来：

简单写的一个小栗子(https://git.oschina.net/sunss/ueditor_upload)

1.首先，必须的，你需要一个按钮，点击弹出文件上传，比如：

上传教案

2.接下来就是onclick事件了：

//弹出文件上传的对话框

function upFiles() {

var myFiles = ue.getDialog("attachment");

myFiles.open();

}

当然上面是上传文件，下面是上传照片，两个的区别在于。。。提供的功能不同

//上传图片

function upImage() {

var myImage = ue.getDialog("insertimage");

myImage.open();

}

3.接着你需要一个文件上传成功之后执行的方法：

//上传文件成功

function okUpload(list){

var content = "已选择:"

var fileD = dialog({

title:"上传教案",

okValue : '确定',

ok : function() {

this.title('提交中…');

submitPlan(fileD);

return false;

},

cancelValue : '取消',

cancel : function() {}

});

fileD.showModal();

fileD.content(content+list);

}

4.然后，最重要的一步到了，修改源码！ueditor.all.js   大约在24820行上  让插件点击确认按钮后执行我们的方法。里面的html参数里面的html可以自己根据需要修改。

execCommand: function (command, filelist){

filelist = utils.isArray(filelist) ? filelist : [filelist];

if(me.fireEvent('afterUpfile', filelist) === true){

return;

}

var i, item, icon, title,

html = '',

URL = me.getOpt('UEDITOR_HOME_URL'),

iconDir = URL + (URL.substr(URL.length - 1) == '/' ? '':'/') + 'dialogs/attachment/fileTypeImages/';

for (i = 0; i < filelist.length; i++) {

item = filelist[i];

icon = iconDir + getFileIcon(item.url);

title = item.title || item.url.substr(item.url.lastIndexOf('/') + 1);

html += '

' +

'' +

'' + title + '' +

'

';

}

okUpload(html);//执行自己方法

me.execCommand('insertHtml', html);

}

5.在html中实例化编辑器。这个应该都知道，然后把编辑器隐藏，因为我们只需要他的上传功能：

var ue = UE.getEditor('contents');

ue.addListener("ready", function () {

UE.getEditor('contents').setHide();

});

6.运行之后效果如下

用得着的童鞋可以点个赞呗。有不明白的地方可以加我QQ或者群里，有问必答

QQ群：530456619

QQ：707012377