javascript - TinyMCE 文本区域不响应 'onkeydown' 事件

Question

如果用户在 TinyMCE 插件的文本区域中进行了更改，我会尝试在用户离开页面时触发警告。

这是我的代码。如果我使用普通形式的文本区域，它就可以工作，但是当我将“onkeydown”事件添加到tiny的文本区域时，它就不太顺利。我已经使用浏览器控制台改进了“cambios”的值，我发现它永远不会改变它的值。

JS:

var cambios = false;

function change_cambios (){ cambios = true;}

window.onbeforeunload = function() {
    if(cambios) {
        return confirm('Are you sure?');
    }
    return;
}    

HTML:

    <form id="formulari" method="post" >
        <textarea id="ap0sub2" name="area" onkeydown="change_cambios();"></textarea>
    </form>

如果我在tinyMCE插件中使用它，效果会非常好。但是当我包含文本编辑器时，“cambios”的值仍然为 false。

有什么想法吗？

非常感谢!

Answer 1

tinyMCE 隐藏 textarea 并呈现其自己的可内容编辑 div，因此您的 textarea 上不会发生任何按键操作。初始化时，您需要使用tinyMCE的方法添加事件监听器:

tinyMCE.init({
   selector:'#ap0sub2',
   setup : function(ed) {
                  ed.on('keydown', function(e) {
                     cambios = true;
                     console.log(cambios);
                  });
            }
});

工作演示:http://jsfiddle.net/exmdg7ha/