jQuery监控表的变化

jQuery monitor table for change?

本文关键字:变化 监控 jQuery      更新时间:2023-09-26

我有一个插件,可以显示/隐藏表中的列。

然而,我也在表上使用了其他几个插件,因此表是相当动态的。

我正在寻找一种方法来监控表的任何时候发生的事情。

,

添加行,删除行,隐藏行…

是否有一个通用的.change()事件为任何dom元素?

可以绑定到DOM事件:

$(document).ready(function(){
    $(document).bind('DOMNodeInserted', function(event){
        console.log('inserted '+event.target.nodeName + ', parent: '+event.relatedNode.getAttribute('id'));
    });
    $(document).bind('DOMNodeRemoved', function(event){
        console.log('removed');
    });
    $(document).bind('DOMSubtreeModified', function(event){
        console.log('modified '+event.target.getAttribute('id'));
    });
    $('#tbl').append($('<tr></tr>').
                    attr('id', 'newrow'));
});
这里的

小提琴

当然,你的元素必须有标识符才能使它有用。

您可以使用livequery来检测何时添加/删除了行:

$("tr").livequery(function() {
  console.log($(this) + " was added");
}, function() {
  console.log($(this) + " was removed");
});

不幸的是,没有跨浏览器的更改事件来操作DOM。您有几个选项:

  1. 使用操作表的函数来执行其他操作。
  2. 创建一个pub/sub系统来发布和订阅你自己的自定义表事件。