倾听部门内部的变化并相应地采取行动

您可以选择创建自己的自定义事件,这样您仍然可以清楚地分离逻辑。

绑定到自定义事件:

$('#laneconfigdisplay').bind('contentchanged', function() {
  // do something after the div content has changed
  alert('woo');
});

在更新div的函数中:

// all logic for grabbing xml and updating the div here ..
// and then send a message/event that we have updated the div
$('#laneconfigdisplay').trigger('contentchanged'); // this will call the function above

这个 change 活动仅限于 input , textarea 及 select .

见 http://api.jquery.com/change/ 更多信息。

http://api.jquery.com/change/

更改只对输入表单元素起作用。

您可以在xml/xsl转换之后触发一个函数,或者创建一个监听器:

var html = $('#laneconfigdisplay').html()
setInterval(function(){ if($('#laneconfigdisplay').html() != html){ alert('woo'); html = $('#laneconfigdisplay').html() } }, 10000) //checks your content box all 10 seconds and triggers alert when content has changed...

如果可能,您可以将div更改为textarea并使用.change()。

另一种解决方案是使用隐藏的文本区域,并在更新div的同时更新文本区域,然后对隐藏的文本区域使用.change()。

你也可以使用 http://www.jacklmoore.com/autosize/ 使文本区域更像div。

<style>
.hidden{
display:none
}
</style>

<textarea class="hidden" rows="4" cols="50">

</textarea>


$("#hiddentextarea").change(function() {

alert('Textarea changed');

})

更新:更新后的文本区域似乎必须散焦,有关详细信息: How do I set up a listener in jQuery/javascript to monitor a if a value in the textbox has changed?

尽管这件事 DOMSubtreeModified 不推荐使用,从现在起它可以工作,因此对于任何临时项目,您可以使用它如下。

$("body").on('DOMSubtreeModified', "#mydiv", function() {
    alert('changed');
});

但从长远来看,你必须使用 MutationObserver 应用程序编程接口。

有一个很好的 jquery plugin, LiveQuery , that does just this .

live query利用jquery选择器的强大功能,通过绑定事件或自动触发匹配元素的回调,即使在加载页面和更新dom之后也是如此。

例如,您可以使用以下代码将单击事件绑定到所有a标记,甚至是通过ajax添加的任何a标记。

$('a').livequery('click', function(event) { 
    alert('clicked'); 
    return false; 
}); 

将新的a标记添加到文档中后,live query将绑定click事件,无需调用或执行任何其他操作。

这里是一个 working example of its magic …

试试这个

$('#D25,#E37,#E31,#F37,#E16,#E40,#F16,#F40,#E41,#F41').bind('DOMNodeInserted DOMNodeRemoved',function(){
          // your code;
       });

不要用这个。这可能会使页面崩溃。

$('mydiv').bind("DOMSubtreeModified",function(){
  alert('changed');
});