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

时间:2010-09-15 23:34:03

标签: jquery events

长话短说 - 我有一个可编辑的<div>,我想在有人粘贴内容时清除格式。由于jQuery无法控制剪贴板,我不想进入跨浏览器兼容性,我想我会监听内容发生变化时运行的事件。

我已经尝试了$("#mydiv").change()但很明显只适用于文本字段和textareas(?),那么还有办法吗?

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

谢谢!

5 个答案:

答案 0 :(得分:4)

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

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

$(function() {

      // Get initial text:
    var previous = $("#mydiv").text();

      // Make DIV editable if clicked
    $("#mydiv").click(function() { this.contentEditable = 'true'; });

      // Create a function for what to do if there is a change:
    $check = function() {

          // Check for a change
        if ($("#mydiv").text() != previous) {
            // What to do if there's been a change
            // ...
        }

          // Store what contents are for later comparison
        previous = $("#mydiv").text();        
    }

      // Add the div changed handler to both keyup (ctr + v)
      //   and mouseclick (right click paste)
    $(document).keyup($check);
      // Right click work around is to check every Xs
    setInterval(function() { $check(); }, 1000);
});​

setInterval()


这适用于粘贴....它捕获ctr,shift等键。 (如果您尝试使用w ctr-v并且一个接一个地释放一个键,那么请关注状态,因为状态仅在第一个键释放后显示changed并且{{1}在第二次发布后....应该)。


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

答案 1 :(得分:0)

使用 <textarea> 代替

答案 2 :(得分:0)

你可以使用'keydown'事件 - 它会捕获shift键按下,因此可以用于粘贴,也可以用于删除键。

如果您需要检测内容是否已更改,请存储旧内容并比较触发事件的时间。

要通过鼠标捕获粘贴,您可能需要根据计时器定期比较当前内容与旧内容。您可以通过激活焦点上的计时器并在模糊时停止它来减少一些开销。

答案 3 :(得分:0)

这可能是您的解决方案: http://garage.pimentech.net/scripts_doc_jquery_jframe/

答案 4 :(得分:0)

我认为TinyMCE for JQuery可以为您完成工作。