UEditor的使用

一、引用CSS和JS：

<meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
script type="text/javascript" src="/Content/Plugins/UEditor/ueditor.config.bbs.js"></script>
="/Content/Plugins/UEditor/ueditor.all.min.js" charset="utf-8"="/Content/Plugins/UEditor/lang/zh-cn/zh-cn.js">

View Code

二、HTML：

 <!-- 加载编辑器的容器 -->
id="ueditor" type="text/plain" style="width: 99%; height: 300px;">

View Code

三、创建编辑器对象：

var ue;

$(function () {
    $( () {
        ue = UE.getEditor('ueditor',{
            maximumWords: 4000 //允许的最大字符数
        }); 创建和引用编辑器实例
        ue.addListener('ready', (editor) {
             ue.setHeight(500); //编辑器家在完成后，设置高度为300默认关闭了自动长高
        });
        ue.addListener("contentChange",1)"> () {
            SimpoValidate.removehilight($("#ueditor").find("iframe").parent());
        });
    });

});

View Code

四、保存数据：

添加
 btnAdd() {
    var title = $("#Title").val();
    var contents = ue.getContent().replace(/</g,"&lt;").replace(/>/g,"&gt;");
    var txt = ue.getContentTxt();
    var boardId = "@board.Id";

    $.ajax({
        url: "/BBS/Board/SaveTopicAdd" (data) {
            if (fnet.ajax.success(data)) {
                fnet.msg.info("发帖成功");
                back();
            }
            else {
                fnet.msg.error(data.msg);
            }
        }
    });
}

View Code

五、编辑器的工具栏配置：

'|','emotion','scrawl','insertimage','insertvideo','music'
]]

View Code

效果图：