【JQuery插件】Kindeditor 在MVC使用细节问题

在以前WebFrom项目 中使用Kindeditor 是极其容易及快速上交项目 ,这次在使用MVC使用 。。。脑子有点缺氧(晚上少看点 “ 澳首家线上场”)。。。
对于咱们 懒人而言 干活就是 下载直接能使用。

1.提交却没有数据值

<input type="hidden" name="Content" value="@ModelContent" />
提交前 复制 到Hidden
                $("input[name=DocumentContent]").val(
                    window.editor.html().replace(/</g, "<").replace(/>/g, ">")
                );   

解决办法:用找一个额外的容器

2.提交数据不一定是最新的

KindEditor.ready(function (K) {
        window.editor = K.create('#editor_id', {
            resizeType: 1,

            uploadJson: '/System/Common/EditorFile',
            afterBlur: function () {  //利用该方法处理当富文本编辑框失焦之后,立即同步数据
                KindEditor.sync("#editor_id");
            }
        });
    });

利用该方法处理当富文本编辑框失焦之后,立即同步数据

3.复制Work内容到编辑器、修改字体大小颜色、添加图片后 转换成控制器中的实体出错。

.replace(/</g, "&lt;").replace(/>/g, "&gt;")

两个标签没有自动 转换

4.再次编辑时,内容变成全是HTML代码

          <textarea id="editor_id"  style="height:600px;"  >
                                               @Model.Content.Replace( "&lt;", "<").Replace( "&gt;", ">")
                                        </textarea>

从数据库出来里 预处理

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 2
    评论
BJUI 是一个基于 jQuery 的前端框架,其中包含了富文本编辑器 kindeditor使用 kindeditor 需要先引入相关的 CSS 和 JS 文件,然后初始化编辑器。 以下是使用 kindeditor 的基本步骤: 1. 引入 kindeditor 的 CSS 和 JS 文件,可以从官网下载最新版。 ```html <link rel="stylesheet" href="/path/to/kindeditor/themes/default/default.css" /> <script src="/path/to/kindeditor/kindeditor.js"></script> ``` 2. 在需要使用编辑器的文本框处添加一个 id 属性。 ```html <textarea id="editor"></textarea> ``` 3. 初始化编辑器,并设置相关配置项。 ```javascript <script> KindEditor.ready(function(K) { K.create('#editor', { width : '100%', height : '400px', items : [ 'source', '|', 'undo', 'redo', '|', 'preview', 'template', 'cut', 'copy', 'paste', 'plainpaste', 'wordpaste', '|', 'justifyleft', 'justifycenter', 'justifyright', 'justifyfull', 'insertorderedlist', 'insertunorderedlist', 'indent', 'outdent', 'subscript', 'superscript', 'clearhtml', 'quickformat', 'selectall', '|', 'fullscreen', '/', 'formatblock', 'fontname', 'fontsize', '|', 'forecolor', 'hilitecolor', 'bold', 'italic', 'underline', 'strikethrough', 'lineheight', 'removeformat', '|', 'image', 'flash', 'media', 'insertfile', 'table', 'hr', 'emoticons', 'baidumap', 'pagebreak', 'anchor', 'link', 'unlink' ], afterBlur: function () { this.sync(); } }); }); </script> ``` 以上是一个简单的使用 kindeditor 的示例,你可以根据自己的需要修改配置项来定制编辑器。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 2
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值