@chenxushan
2016-04-04T14:53:28.000000Z
字数 1498
阅读 1012
未分类
使用方法：
- 引入js，css文件
- 在你想生成编辑的div层创建editor区域
- 方法：var editor = new wangEditor('div1');
- 图片上传需要写一句代码：editor.config.uploadImgUrl = '/admin/notifypic';值是API地址
- 如果定制编辑器菜单栏只需要图片，可以editor.config.menus = ['img','|'];
- 获取编辑器内容方法，两个，一个是获取文本，一个是获取html代码
```js
$('#btn1').click(function () {
// 获取编辑器区域完整html代码
var html = editor.$txt.html();
// 获取编辑器纯文本内容
var text = editor.$txt.text();
alert(html);
});
```
<!DOCTYPE html><html><head><meta charset="UTF-8"><title>wangEditor2 test</title><link rel="stylesheet" type="text/css" href="./css/editor/css/wangEditor.min.css"><style type="text/css">#div1 {width: 500px;height: 400px;max-width: 400px;max-height: 400px;}.container{width: 500px;max-width: 500px;height: 400px;}</style></head><body style="padding:0 20px;"><p>wangEditor - 配置表情</p><div class="container"><div id="div1"><p>请输入内容222</p></div></div><button id="btn1"> 提交</button><script language="JavaScript" src="{{ URL::asset('/') }}js/editor/js/lib/jquery-1.10.2.min.js"></script><script language="JavaScript" src="{{ URL::asset('/') }}js/editor/js/wangEditor.js"></script><script type="text/javascript">var editor = new wangEditor('div1');editor.config.menus = ['img','|'// 'source',// 'bold',// 'underline',// 'italic',// 'strikethrough',// 'eraser',// 'forecolor',// 'bgcolor'];editor.config.uploadImgUrl = '/admin/notifypic';editor.create();$('#btn1').click(function () {// 获取编辑器区域完整html代码var html = editor.$txt.html();// 获取编辑器纯文本内容var text = editor.$txt.text();alert(html);});</script></body></html>