包含文件
index.html
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>wangEditor demo</title>
</head>
<body>
<div id="editor">
</div>
<input type="hidden" name="content" id="content" value="">
<!-- 注意, 只需要引用 JS,无需引用任何 CSS !!!-->
<script type="text/javascript" src="wangEditor.js"></script>
<script type="text/javascript">
//5秒自动保存
window.setInterval(function() {
$('#content').click();
},5000)
var E = window.wangEditor
var editor = new E('#editor')
// 自定义菜单配置
editor.customConfig.menus = [
//'head', // 标题
//'bold', // 粗体
//'fontSize', // 字号
//'fontName', // 字体
//'italic', // 斜体
//'underline', // 下划线
//'strikeThrough', // 删除线
//'foreColor', // 文字颜色
//'backColor', // 背景颜色
//'link', // 插入链接
//'list', // 列表
'justify', // 对齐方式
//'quote', // 引用
//'emoticon', // 表情
'image', // 插入图片
'table', // 表格
//'video', // 插入视频
//'code', // 插入代码
//'undo', // 撤销
//'redo' // 重复
],
// 下面两个配置,使用其中一个即可显示“上传图片”的tab。但是两者不要同时使用!!!
editor.customConfig.uploadImgShowBase64 = true // 使用 base64 保存图片
//editor.customConfig.uploadImgServer = 'upload'
editor.create()
//editor.$textElem.attr('contenteditable', false)//禁止编辑
//editor.txt.html('<p>用 JS 设置的内容</p>')
//document.getElementById('editor').addEventListener('click', function () {
document.getElementById('content').addEventListener('click', function () {
document.getElementsByName("content")[0].value = editor.txt.html();
})
//}, false)
</script>
</body>
</html>
wangEditor.js
wangEditor.min.css
js,css文件官网下载