您好, 欢迎来到 !    登录 | 注册 | | 设为首页 | 收藏本站

在div更改时触发jQuery事件

在div更改时触发jQuery事件

您可以使用DOMNodeInsertedDOMNodeRemoved检查是否添加删除了元素。不幸的是,IE不支持功能

$('#myDiv').bind('DOMNodeInserted DOMNodeRemoved', function(event) {
    if (event.type == 'DOMNodeInserted') {
        alert('Content added! Current content:' + '\n\n' + this.innerHTML);
    } else {
        alert('Content removed! Current content:' + '\n\n' + this.innerHTML);
    }
});

您可以使用保存初始内容和将来的更改.data()。这是一个例子。

var div_eTypes = [],
    div_changes = [];
$(function() {
    $('#myDiv').each(function() {
        this['data-initialContents'] = this.innerHTML;
    }).bind('DOMNodeInserted DOMNodeRemoved', function(event) {
        div_eTypes.concat(e.type.match(/insert|remove/));
        div_changes.concat(this.innerHTML);
    });
});

输出示例:

> $('#myDiv').data('initialContents');
"<h1>Hello, world!</h1><p>This is an example.</p>"
> div_eTypes;
["insert", "insert", "remove"]
> div_changes;
["<iframe src='http://example.com'></iframe>", "<h4>IANA — Example domains</h4><iframe src='http://example.com'></iframe>", "<h4>IANA – Example domains</h4>"]

您可能还想包括DOMSubtreeModified它,因为我发现了这一点,DOMNodeInserted并且DOMNodeRemoved如果innerHTML直接替换一个元素也不会触发。它仍然不能在IE中运行,但至少在其他浏览器中可以正常运行。

JS 2022/1/1 18:24:33 有320人围观

撰写回答


你尚未登录,登录后可以

和开发者交流问题的细节

关注并接收问题和回答的更新提醒

参与内容的编辑和改进,让解决方法与时俱进

请先登录

推荐问题


联系我
置顶