Question

我在我的表单中使用texwreas上的jwysiwyg插件（jwysiwyg：https://github.com/akzhan/jwysiwyg）

我想检测对我表单中任何textareas的更改。

通常情况下，使用标准的非生态文本区域，我会这样做：

$('textarea').change(function(e){
    alert('Something changed!');
 });

由于jwysiwyg的DOM操作，当使用jwysiwyg时，这证明是无效的。

有人有任何指示吗？

Answer 1

使用此代码，我已使用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: accessing contents of an iframe

On keypress, when stop after X seconds call function

<强>解释：

1）'jwysiwyg插件'它的作用是替换iframe的textarea。文本位于“p”标记内，另外需要考虑的是无法单击此标记，如果单击文本，实际点击的内容就是“iframed html”标记。

2）要使jQuery访问并选择iframed元素，必须使用'contents（）'方法。这样我们就可以开始用iframe触发一些函数了。

3）创建detectFn（），它将在检测到伪文本区域中的更改后执行您要使用的代码。

4）声明变量'timer'。

5）bind（）方法必须与'iframed html'标签一起使用才能使用keyup事件。这样就可以模拟textarea的打字动作。

6）每个keyup将多次执行detect函数，为了防止这种情况，我们使用setTimeout方法并将detectFn存储在变量'timer'中。最后，必须将变量作为参数传递给clearTimeout，这样每个keyup将取消之前执行的detect函数。

Answer 2

我发现这更简单：

    $('#editor_textarea').wysiwyg('document').keypress(function(e) {
        e.preventDefault(); //This will cancel the keypress
        alert('Keypress in jwysiwyg editor detected!');
    });

Answer 3

您可以将autoSave设置为true，并执行以下操作：

$（element）.wysiwyg（'getContent'）。afterSave（function（）{/ magic /}

如果你想要，可以触发此处理程序中元素的“更改”

如何使用jQuery检测使用jWYSIWYG插件的textarea内容？

3 个答案: