我在表单中的文本区域使用jwysiwyg插件(jwysiwyg:https://github.com/akzhan/jwysiwyg)
我想检测我表单中任何文本区域的更改。
通常,对于标准的非wysiwyg文本区域,我会:
$('textarea').change(function(e){
alert('Something changed!');
});
当使用jwysiwyg时,由于jwysiwyg的DOM操作,这被证明是无效的。
有人有什么线索吗?
使用此代码,我已经在help/example/01.basic.html和02.full.html中对其进行了测试,我想它也能和其他人一起工作:
$(document).ready(function(){
var current = $("#wysiwyg-wysiwyg-iframe").contents().find('html');
function detectFn(){
alert('Detected');
}
var timer;
current.bind({
keyup: function(){
clearTimeout(timer);
timer = setTimeout(detectFn, 2000)
}
});
});
来源:
Yasir Laghari和Ghommey对该解决方案拥有真正的信任。
jQuery/JavaScript:访问iframe 的内容
按键时,X秒后停止调用功能
解释:
1) "jwysiwyg插件"的作用是将文本区域替换为iframe。文本在"p"标记内,另一件需要考虑的事情是这个标记无法点击,如果你点击文本,你实际点击的是"iframe html"标记。
2) 为了让jQuery访问并选择iframe元素,必须使用"contents()"方法。这样我们就可以开始用iframe触发一些函数。
3) 创建detectFn(),它将在检测到伪文本区域中的更改后执行您想要使用的代码。
4) 声明变量"timer"。
5) bind()方法必须与"iframe html"标记一起使用才能使用keyup事件。这样就可以模拟文本区域的键入操作。
6) 每个keyup都会多次执行detect函数,为了防止这种情况,我们使用setTimeout方法并将detectFn存储在变量"timer"中。最后,必须将变量作为参数传递给clearTimeout,这样每个keyup都将取消检测函数的先前执行。
我发现这要简单得多:
$('#editor_textarea').wysiwyg('document').keypress(function(e) {
e.preventDefault(); //This will cancel the keypress
alert('Keypress in jwysiwyg editor detected!');
});
您可以将autoSave设置为true并执行以下操作:
$(element).wysiyg('getContent').fafterSave(function(){/magic/}
如果您愿意,您可以在此处理程序中触发元素的"更改"