JS CKEditor使用setData后绑定click事件
CKEditor使用setData()时会自动丢失初始时绑定的时间,在百度时发现有很多方法都不对。
近期在做项目的时候,由于客户需要,将原来的文本格式的textarea标签更改成富文本编辑器--CKEditor,插件使用起来很方便,网上教程很多。API看起来比较麻烦。
为文本框添加绑定事件的两种方式:
1、CKeditor预加载时可以绑定一次:
IS代码:
var a = CKEDITOR.replace( id);//id是页面元素的ID值;ckeditor_onFocus是自己定义的方法
a.on("instanceReady", function () {
this.document.on("click", function () {ckeditor_onFocus(id);});
});
第一个方法很简单易懂,开始初始化时就绑定事件。这样做事对的,但是CKEditor在使用赋值方法setData()之后,初始化绑定的click事件 就会自动丢失;
所以在每次使用setData()方法后需要重新绑定事件,两个绑定方法是不一样的。
JS代码:
function CKE_setData(id,va){//id是页面元素的id值;va是需要赋值的内容
CKEDITOR.instances[""+id+""].setData(va,function() {
CKEDITOR.instances[""+id+""].on("focus", function () {ckeditor_onFocus(""+id+"");});
} );
}
重新绑定后,再次点击就可以实现绑定的事件效果了。
在使用CKEditor的时候一定要注意着两种绑定事件的方法。
JS CKEditor使用setData后绑定click事件的更多相关文章
- JS: javascript 点击事件执行两次js问题 ,解决jquery绑定click事件出现点击一次执行两次问题
javascript 点击事件执行两次js问题 在JQuery中存在unbind()方法,先解绑再添加点击事件,解决方案为: $(".m-layout-setting").unbi ...
- google跟踪代码管理器gtm无法给相同class元素绑定click事件埋点解决
Google 跟踪代码管理器是一个跟踪代码管理系统 (TMS),可以帮助您快速轻松地更新网站或移动应用上的跟踪代码及相关代码段(统称为“代码”).将一小段跟踪代码管理器代码添加到项目后,您可以通过网页 ...
- jQuery-介绍 加载 选择器 样式操作 属性操作 绑定click事件
jQuery - 介绍 加载 选择器 样式操作 属性操作 绑定click事件 注意:以下部分问题不能实现效果,因该是单词拼写错误(少个t)或者没有加引号(“swing”)... jquery介绍 jQ ...
- ios 设备用jquery live绑定 click 事件不管用
问题描述:用js拼接的html追加到页面,然后用 live 绑定click事件不起作用 解决办法:1.直接在标签写onclick事件 2.给需要绑定的标签添加css样式{cursor:pointe ...
- jquery单选框radio绑定click事件实现和是否选中的方法
使用jquery获取radio的值,最重要的是掌握jquery选择器的使用,在一个表单中我们通常是要获取被选中的那个radio项的值,所以要加checked来筛选,比如有以下的一些radio项: 1. ...
- jquery单选框radio绑定click事件实现方法
本文实例讲述了jquery单选框radio绑定click事件实现方法.分享给大家供大家参考. 具体实现方法如下: 复制代码代码如下: <html><head><title ...
- vue 移动端在div上绑定click事件 失效
在.vue的文件中使用了better-scroll,在div标签上绑定click事件后,无效. 原因:使用了better-scroll,默认它会阻止touch事件.所以在配置中需要加上click: t ...
- JS如何调用隐藏按钮的click事件
js如何调用隐藏按钮的click事件:1.设定隐藏不要使用Visiable属性,使用style.display=none:2.触发JS事件可以使用fireEvent方法,如:document.getE ...
- [ 面试没回答上的问题2]IOS上给body绑定click事件的bug
面试被问到ios上的bug,自己提到绑定click事件的bug,但是并没有把问题讲的很清楚,这里再清理一下思路. 这个bug只在IOS上有,包括ihone,ipad,由于ios浏览器都用的safari ...
随机推荐
- OpenCASCADE入门指南
OpenCASCADE入门指南 eryar@163.com 一.概述 荀子说“君子性非异也,善假于物也”.当你会用英语,就可以与世界各国的人交流:当你会用编程语言,就可以与计算机交流:当你会用数学语言 ...
- 一种使用GDI+对图片尺寸和质量的压缩方法
今天同事向我询问图片压缩的算法.我想起大概两三年前做过的一个项目. 当中包括了尺寸和质量两种压缩算法.而且支持JPEG.bmp.PNG等格式. 今天把这段逻辑贴出来,供大家參考.(转载请指明来源于br ...
- 利用linux shell自己主动顶贴
在论坛上面发帖问个什么东西的话,一旦不顶.帖子就秒沉了,可是又实在不想每时每刻都去顶,怎么办?以下展示了怎样利用shell 的crontab实现自己主动顶贴. 闲话不多说了,以豆瓣为例-– 1: 用c ...
- 基于Office 365的随需应变业务应用平台
作者:陈希章 发表于 2017年9月7日 这是我去年10月底在微软技术大会(Microsoft Ignite 2016) 上面的演讲主题,承蒙大家抬爱,也沾了前一场明星讲师的光,我记得会场几乎是满座. ...
- 自学Zabbix3.5.4-监控项item-History and trends
历史和趋势是在Zabbix中存储收集数据的两种方法.然而,历史保持着每一个收集的价值,趋势保持每小时的平均信息,因此减少了对资源的需求. 1. 保留历史数据 我们可以通过如下方式来设置保留数据的时 ...
- Spring 链接数据库
一.前言 Spring 现在是我们在做 JavaWeb 开发中,用的最主流的框架.以后是不是我们暂时不知道,但现在是.废话不多我就介绍 Spring 中.链接数据库的三种方式: git源码地址 需要的 ...
- 添加用户useradd,给用户设置修改密码passwd,修改用户信息usermod,修改用户密码状态chage,删除用户userdel,查询用户及组id,切换用户su,查看当前环境变量env
useradd 用户名 passwd 用户名,给指定用户设密码 passwd给当前用户设密码 添加一个用户系统会自动在以下文件或目录创建对应用户信息: [root@localhost ~]# grep ...
- js验证input输入框(字母,数字,符号,中文)
[javascript]代码库 <h1>js验证输入框内容</h1> <br /> <br /> 只能输入英文 <input type=" ...
- JAVA中的集合与排序
一:常见的集合类 Collection接口 和 Map接口 Collection ①:collection是最常见的集合的上级接口. ②:继承自collection的常用接口有List,Set, ...
- lesson - 2 yum /单用户/救援模式/Linux 启动
课程大纲:1. yum使用yum 是一个在线安装软件包的工具,它可以帮我们解决软件包的依赖,这个日后会详细介绍.我们介绍了以下几个用法:yum list 这个命令可以列出所有安装过和未安装的软 ...