单独调用ueditor的附件上传功能(二)自定义图片上传页面,图片按名称顺序上传
需要单独使用ueditor的图片上传功能,同时调整上传的页面样式,但是又不想改变其他已经在使用的ueditor编辑器图片上传页面,通过阅读ueditor.all.js 发现有 iframeUrlMap 变量 ,而在 ueditor.config.js 同样有 iframeUrlMap 的变量配置
在文件夹dialogs下创建一张全新的 imageupload.html ,并将该html地址引入配置即可
var ue = UE.getEditor('editor1',{
isShow: false,//隐藏编辑器
focus: false,
enableAutoSave: false,
autoSyncData: false,
autoFloatEnabled:false,
wordCount: false,
sourceEditor: null,
scaleEnabled:true,
maximumWords:1,
toolbars:toolbars,
iframeUrlMap:{insertimage:'~/dialogs/image/imageupload.html'}
});
由于批量选择图片的时候,图片列表的排序和上传的顺序并不一致。如果图片有命名规则,同时需要按名称顺序上传。
ueditor 的图片上传使用的是webUploader ,可以通过webUploader 的 sort 方法调整上传顺序
http://fex.baidu.com/webuploader/doc/index.html#WebUploader_Uploader_sort
在image.js里查找 filesQueued ,添加uploader.sort 如下
uploader.on('filesQueued', function (file) { if (!uploader.isInProgress() && (state == 'pedding' || state == 'finish' || state == 'confirm' || state == 'ready')) { setState('ready'); } //对图片按名称调整上传顺序 uploader.sort(function( a, b ) { if ( a.name < b.name ) return -1; if ( a.name > b.name ) return 1; return 0; }); updateTotalProgress(); });
图片会根据名称的顺序上传