contenteditable：使用行/列修饰符时检测元素变化

Posted 2023-02-24

【中文标题】contenteditable：使用行/列修饰符时检测元素变化

【英文标题】：contenteditable: Detect element changes when using row/column modifier

【发布时间】：2011-11-05 10:38:59

【问题描述】：

我使用上一篇文章中的以下代码来检测（大部分）对具有“contenteditable”属性的元素的更改。但遗憾的是它不包括在使用浏览器 (Firefox) 提供的表格行/列修饰符控件时发生的表格更改

    $('[contenteditable]').live('focus', function() 
       var $this = $(this);
       $this.data('before', $this.html());
       return $this;
    ).live('blur keyup paste', function() 
       var $this = $(this);
       if ($this.data('before') !== $this.html()) 
           $this.data('before', $this.html());
           $this.trigger('change');
       
       return $this;
    );

如何更改此代码以包含对浏览器控件施加的更改的检测？

【参考方案1】：

作为一种解决方法，我已经完成了以下操作

我已将DOMSubtreeModified 的事件侦听器添加到元素中。 它经常触发，所以我添加了setTimeout 延迟 在延迟函数中，我使用上面提到的 $(this).data() 相同的方法检查元素的内容是否发生了变化。

这有点脏，但可以解决问题。