用于html的jQuery事件在div元素中更改?

Hub*_*bro 9 jquery events

长话短说 - 我有一个可编辑的<div>,我想清楚格式,当有人粘贴的东西.由于jQuery无法控制剪贴板,我不想进入跨浏览器兼容性,我想我会听一个内容更改时运行的事件.

我试过$("#mydiv").change()但很明显只适用于文本字段和textareas(?),所以有没有办法做到这一点?

我也接受替代解决方案,我选择使用的任何解决方案都将被标记为正确答案.

谢谢!

Pet*_*tai 4

您可以利用它.keyup()进行复制和粘贴。右键单击然后在上下文菜单中选择粘贴似乎没有记录单击,因此.click()不起作用......而是使用setInterval()每 X 秒检查一次以捕获右键单击粘贴。

\n\n

不确定是否可以绑定.keyup()到 div(div 是否可在所有浏览器中聚焦),但所有按键都会冒泡到文档,因此$(document)始终有效。

\n\n
$(function() {\n\n      // Get initial text:\n    var previous = $("#mydiv").text();\n\n      // Make DIV editable if clicked\n    $("#mydiv").click(function() { this.contentEditable = \'true\'; });\n\n      // Create a function for what to do if there is a change:\n    $check = function() {\n\n          // Check for a change\n        if ($("#mydiv").text() != previous) {\n            // What to do if there\'s been a change\n            // ...\n        }\n\n          // Store what contents are for later comparison\n        previous = $("#mydiv").text();        \n    }\n\n      // Add the div changed handler to both keyup (ctr + v)\n      //   and mouseclick (right click paste)\n    $(document).keyup($check);\n      // Right click work around is to check every Xs\n    setInterval(function() { $check(); }, 1000);\n});\xe2\x80\x8b\n
Run Code Online (Sandbox Code Playgroud)\n\n

jsFiddle 示例

\n\n


\n这适用于粘贴....它捕获 ctr、shift 等键。(如果您尝试使用 ctr-v 并释放一个键后又释放一个键,请密切关注状态,因为状态只会changed在释放第一个键和same释放第二个键后显示...... 。 正如它应该)。

\n\n
\n\n

注意:我确实喜欢同时拥有一个.keyup()处理程序和一个setInterval,因为这保证了击键的反馈是即时的......即使右键单击粘贴后可能会有延迟。

\n