UEditor是由百度web前端研发部开发所见即所得富文本web编辑器,具有轻量,可定制,注重用户体验等特点,开源基于BSD协议,允许自由使用和修改代码。
是一功能强大的编辑器。有很多功能值得赞场的!大家可以去 下载 编辑器。
完全版:
1、加载
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script type="text/javascript" src="./ueditor/ueditor.config.js"></script>
<script type="text/javascript" src="./ueditor/ueditor.all.js"></script>
2、创建容器 有3种创建方法,但是官方推荐的是第2种script标签:
1):
<div id="editor" style="width:800px;"></div>
2):
<div style="width:800px;margin:20px auto 40px;">
<script type="text/plain" id="editor" style="width:100%;height:500px;"></script>
</div>
3):
<textarea name="后台取值的key" id="editor">这里写你的初始化内容</textarea>
3、载入编辑器
var editor = new baidu.editor.ui.Editor();
editor.render('editor'); //editor为编辑器容器的id
或者:
var ue = UE.getEditor('editor',{
toolbars:[ ['insertimage','attachment','pasteplain','FontSize','link','unlink']
],
wordCount:true, //开启字数统计
elementPathEnabled : false,//是否启用元素路径,默认是显示
maximumWords:10000, //允许的最大字符数
initialContent:'欢迎使用ueditor!', //初始化编辑器的内容,也可以通过textarea/script给值,看官网例子
autoClearinitialContent:true, //是否自动清除编辑器初始内容,注意:如果focus属性设置为true,这个也为真,那么编辑器一上来就会触发导致初始化的内容看不到了
pasteplain:true, //是否默认为纯文本粘贴。false为不使用纯文本粘贴,true为使用纯文本粘贴
});
迷你版:
1、加载
<script type="text/javascript" src="./umeditor/umeditor.config.js"></script>
<script type="text/javascript" src="./umeditor/umeditor.min.js"></script>
2、创建容器
<div style="width:800px;margin:20px auto 40px;">
<script type="text/plain" id="editor" style="width:100%;height:500px;"></script>
</div>
3、载入编辑器
<script type="text/javascript" charset="utf-8">
var um = UM.getEditor('editor');
</script>
基本使用方法就介绍到这!(完)