基于UEditor的单独图片上传JQuery插件实现

摘要: 基于UEditor的单独图片上传JQuery插件实现

//基于UEditor的单独图片上传
(function($){
//
$.fn.ueditorUploder = function(options){
var opts = $.extend({}, $.fn.ueditorUploder.defaults, options);
return this.each(function(){
//创建随机数
var rand = Math.ceil(Math.random() * 1000) * Math.floor(Math.random() * 100);
//UEditorID
var editorId = 'upload_images_' +rand + '_ueditor';
//添加到UEdior
renderUEditor(editorId);
//初始化UEditor
var editor = UE.getEditor(editorId);
editor.ready(function(){
editor.setDisabled('insertimage');
editor.hide();
editor.addListener('beforeinsertimage',function(t,args){
imageCallback(options.upload,args[0].src);
});
});
//绑定点击事件
$(this).bind("click",function(){
var img = editor.getDialog('insertimage');
img.render();
img.open();
});
});
};
//绘制UEditor
function renderUEditor(editorId){
$("<div style='display:none;'></div>")
.append("<script id='"+editorId+"' type='text/plain'></script>")
.appendTo('body');
};
//获取img的src回调
function imageCallback(uploadCallback,url){
if(uploadCallback)uploadCallback(url);
};
//
$.fn.ueditorUploder.defaults = {};

})(jQuery);

调用方法:

$("#upload_${module_id}"). ueditorUploder({
upload:function(url){
$("input[name='imgUrl']").val(url);
$("input[name='imgUrl']").trigger('change');
}
});