动态创建多个KindEditor编辑器


首先写这篇文章是为了以后自己使用,其中的逻辑方式可能不是最好的,因本人也是菜鸟一只。言归正传。
创建多个编辑器是因为有个项目类似于微博的评论的功能,一个页面会有多个文章或广播就需要多个评论,根据加载的文章数来动态创建多个编辑器了,我的方式如下:


var K = window.KindEditor;//编辑器全局变量
 var kinditerArry = new Array(4);//多个编辑器的数组,此处因为我数据绑定控件一页最多显示4个文章所以就写死了长度为4的数组
 var kinditerindex = 0; //编辑器初始索


下面是关键:
dlstCircleArticle是个DIV里面包含了根据数据绑定的多个多行文本框,所以只需循环文本框来创建多个编辑器,至于编辑器的初始化可以自己去网上找相关文章
这里不多做说明了


 $("#dlstCircleArticle").find("textarea").each(function (index, item) {
                var objId = $(this).attr("id");
                kinditerArry[kinditerindex] = K.create('#' + objId, {
                    cssPath: '../kindeditor-4.1.10/plugins/code/prettify.css',
                    uploadJson: 'ashx/upload_json.ashx',
                    fileManagerJson: 'ashx/file_manager_json.ashx',
                    allowFileManager: false,
                    allowImageRemote: false,
                    //得到焦点事件
                    afterFocus: function () {
                        self.edit = edit = this; var strIndex = self.edit.html().indexOf("@我也说一句"); if (strIndex != -1) { self.edit.html(self.edit.html().replace("@我也说一句", "")); }
                    },
                    //值改变事件
                    afterChange: function () {

                    },
                    width: "95%",
                    minheight: 30,
                    height: 30,
                    resizeType: 0,
                    //失去焦点事件
                    afterBlur: function () { this.sync(); self.edit = edit = this; if (self.edit.isEmpty()) { self.edit.html("@我也说一句"); } },   //关键  同步KindEditor的值到textarea文本框   解决了多个editor的取值问题
                    items: [
		            'emoticons'

	                   ],
                    afterCreate: function () {
                        var self = this;
                        self.html("@我也说一句");
                        K.ctrl(document, 13, function () {
                            K('form[name=example]')[0].submit();
                        });
                        K.ctrl(self.edit.doc, 13, function () {
                            self.sync();
                            K('form[name=example]')[0].submit();

                        });
                    }
                });
                kinditerindex++;

            });

        })




原文地址:http://yuncode.net/article/a_53da48784c45b87


  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

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

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

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值