🔥码云GVP开源项目 12k star Uniapp+ElementUI 功能强大 支持多语言、二开方便! 广告
**在页面加入 wangEditor** 在该页面的基础上,引用wangEitor的css、js,添加textarea,生成编辑器。 不明白的同学,可参见【开始使用】一节。之后该页面的代码如下: ```html <!--引入wangEditor.css--> <link rel="stylesheet" type="text/css" href="css/wangEditor-1.3.10.css"> ……省略其他内容…… <div id="uploadContainer"> <input type="button" value="选择文件" id="btnBrowse"/> <input type="button" value="上传文件" id="btnUpload"> <ul id="fileList"></ul> </div> <textarea id='textarea1' style='height:300px; width:100%;'></textarea> ……省略其他内容…… <!--引入jquery、wangEditor.js、plupload.js--> <script type="text/javascript" src='js/jquery-1.10.2.min.js'></script> <script type="text/javascript" src='js/wangEditor-1.3.10.min.js'></script> <script type="text/javascript" src="plupload/plupload.full.min.js"></script> <script type="text/javascript"> $(function(){ //获取dom节点 var $uploadContainer = $('#uploadContainer'), $fileList = $('#fileList'), $btnUpload = $('#btnUpload'); var editor = $('#textarea1').wangEditor(); ……plupload配置的内容…… }); </script> ``` 截止到此,plupload和wangEditor的功能都是相互独立的,两者没有任何关系。 此时,你点击“图片”菜单,肯定得不到你想要的结果。 接下来,我们将把两者结合起来。