教你如何调用百度编辑器ueditor的上传图片、上传文件等模块

出于兴趣爱好，前段时间自己尝试写了一个叫simple的cms，里面使用了百度ueditor编辑器，发现它的多图片上传模块很不错，用起来很方便，又可以选择已经上传好的图片。正好我又是个懒人，发现有现成的自己就不想新开发了。于是我就想，是不是可以调用这个上传模板为自己所用呢？

有了这个想法后，我就到网上查阅资料，可惜资料少的可怜，都不能很好解决我的问题。于是觉得还是自己动手丰衣足食，皇天不负苦心人，终于摸索出解决方法，现在分享出来，和自己有同样想法的小伙伴。

代码如下：

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56

< html >    < head >      < script  src = "ueditor/ueditor1.43.config.js" ></ script >      < script  src = "ueditor/ueditor1.43.all.min.js" ></ script >    </ head >    < body >            < script  type = "text/plain"  id = "j_ueditorupload"  style = "height:5px;display:none;"  ></ script >      < script >        //实例化编辑器        var o_ueditorupload = UE.getEditor('j_ueditorupload',        {          autoHeightEnabled:false        });        o_ueditorupload.ready(function ()        {            o_ueditorupload.hide();//隐藏编辑器            //监听图片上传      o_ueditorupload.addListener('beforeInsertImage', function (t,arg)      {            alert('这是图片地址：'+arg[0].src);      });            /* 文件上传监听       * 需要在ueditor.all.min.js文件中找到       * d.execCommand("insertHtml",l)       * 之后插入d.fireEvent('afterUpfile',b)       */          o_ueditorupload.addListener('afterUpfile', function (t, arg)          {            alert('这是文件地址：'+arg[0].url);          });        });                //弹出图片上传的对话框        function upImage()        {          var myImage = o_ueditorupload.getDialog("insertimage");          myImage.open();        }        //弹出文件上传的对话框        function upFiles()        {          var myFiles = o_ueditorupload.getDialog("attachment");          myFiles.open();        }       </ script >            < button  type = "button"  onClick = "upImage()" >调用上传图片模块</ button >      < br >      < button  type = "button"  onClick = "upFiles()" >调用上传文件模块</ button >          </ body > < html >

注意：需要在ueditor.all.min.js文件中找到d.execCommand("insertHtml",l)之后插入d.fireEvent('afterUpfile',b)