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';
//
$p = $(this).parent();
if($p){
// UEdior
$p.append(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){
var $ueditor = $("<div style='display:none;'></div>");
$ueditor.append("<script id='"+editorId+"' type='text/plain'></script>");
return $ueditor;
};
// 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'); } });