Question

我希望在从后面填充DIV后触发事件，在我的DIV中插入2个节点。我正在使用这个：

$(function () {
    var xml = document.querySelector('#XML');

    xml.addEventListener("DOMNodeInserted", function (ev) {  
        doSomething();
    }, false);
});

一旦加载或重新加载文档，就会填充XML div。在某些时候，用户单击一个按钮，并且在没有重新加载的情况下动态填充div＃XML，即使将DOM节点插入到我的元素中，也没有任何反应。

当我的div改变时，如何触发“doSomething（）”？

Answer 1

您的代码运行正常。您可以在Mutation events和相对兼容性HERE中看到：

＆＃13;

$(function () {
  $('#XML').on("DOMNodeInserted", function (ev) {
    console.log('DO SOMETHING');
  });

  $('#btnAdd').on('click', function(e) {
    $('#XML').append($('<p>', {text: 'this is a new paragragh'}));
  });
});

＆＃13;

<script src="https://code.jquery.com/jquery-1.12.4.min.js"></script>

<div id="XML"></div>

<button id="btnAdd">Add a paragragh to div</button>

＆＃13;

Answer 2

以下代码可能是您要查找的代码。它会在div 1000 milliseconds text中查找更改，您可以根据自己的要求进行更改。如果您的div最初有一些oldVal，请相应地更新$('#XML').change(function(){ alert("div has changed!"); // replace with your actions }); var oldVal = ""; function InputChangeListener() { if($('#XML').val() != oldVal) { oldVal = $('#XML').val(); $('#XML').change(); } } setInterval(InputChangeListener, 1000);。

{{1}}

在填充/显示div时触发事件

2 个答案: