文章内容

C#百度编辑器简单使用

  • 2018-06-24 00:35:26
  • 257
  • 0
  • 0
  1. 百度编辑器下载

    链接: http://ueditor.baidu.com/website/download.html

  2. 引用CSS,JS文件

    <link href="~/Public/Plug-in/ueditor/utf8-net/themes/default/css/ueditor.min.css" rel="stylesheet" />

    <script src="~/Public/Plug-in/ueditor/utf8-net/ueditor.config.js"></script>

    <script src="~/Public/Plug-in/ueditor/utf8-net/ueditor.all.min.js"></script>

    如果担心出现中英文乱码请引用 zh-cn.js  ,

    路径:ueditor\utf8-net\lang\zh-cn\zh-cn.js

  3. 上传文件路径配置:

    image.png

    其中以图片为例,imagePathFormat为上传文件保存路径,imageUrlPrefix 为前缀,例如:https://www.baidu.com:8080

    上传图片时编辑器默认上传到https://www.baidu.com:8080/public/upload/image/......

  4. 初始化

  <script id="essay-container" type="text/plain" data-rule="required"></script>
      UE.delEditor('essay-container');
        var ue = UE.getEditor('essay-container', {
            UEDITOR_HOME_URL: "/public/Plug-in/ueditor/utf8-net/",//控件初始化地址
            autoHeightEnabled: true,
            autoFloatEnabled: true,
            zIndex: 1,//堆叠顺序
            initialFrameHeight: 300,//初始化高度
            maximumWords: 100000 // 最大输入字符
            
     })
    ue.ready(function () {//编辑器初始化完成再赋值  
            var content = $.CurrentNavtab.find("#essay-content").val();
            if (content.length>0) {
                ue.setContent(content);  //赋值给UEditor  
            }
        });
//监控失去焦点事件,保存到指定input方便提交
    UE.getEditor('essay-container').addListener('blur', function (editor) {
            var content = UE.getEditor('essay-container').getContent();
            if (content.length > 0) {
                //进行编码
                content = window.encodeURIComponent(content);
                $.CurrentNavtab.find("#essay-content").val(content);
            }
         
        });
   //监控内容改变事件,保存到指定input方便提交
        UE.getEditor('essay-container').addListener('contentChange', function (editor) {
            var content = UE.getEditor('essay-container').getContent()
            if (content.length > 0) {
                //进行编码
                content = window.encodeURIComponent(content);
                $.CurrentNavtab.find("#essay-content").val(content);
            }
        });