聆听DIV内的更改并采取相应措施
我有一个函数抓取一个XML文档，并根据一个XSL文档进行转换。 然后，将结果放入带有laneconfigdisplay id的div中。 我想要做的是，独立于转换逻辑，为该div设置一个jQuery更改事件，以便可以知道它何时发生更改，并运行一些jQuery代码。
我已经尝试了以下，但它不起作用！
$(document).ready(function() { $('#laneconfigdisplay').change(function() { alert('woo'); }); //Do XML / XSL transformation here }); <!-- HTML code here --> <div id="laneconfigdisplay"></div>
我究竟做错了什么？
您可以select创build自己的自定义事件，这样您仍然可以清楚地分离逻辑。
绑定到自定义事件：
$('#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/ 。
更改只对input表单元素有效。
你可以在XML / XSL转换之后触发一个函数，或者创build一个监听器：
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（）。
另一个解决scheme可以使用隐藏的textarea，并在更新div的同时更新textarea。 然后在隐藏的textarea上使用.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'); })
更新：好像textarea必须在更新后焦点，更多信息： 如何设置一个监听器在jQuery / JavaScript来监视如果文本框中的值已更改？
有一个很好的jquery插件LiveQuery ，可以做到这一点 。
实时查询利用jQueryselect器的强大function，通过绑定事件或自动魔法地为匹配元素触发callback，即使在页面已经加载和DOM更新之后。
例如，您可以使用以下代码将点击事件绑定到所有A标记，甚至可以通过AJAX添加任何A标记。
$('a').livequery('click', function(event) { alert('clicked'); return false; });
一旦将新的A标签添加到文档中，Live Query将绑定单击事件，并且没有其他任何需要调用或完成的事件。
这是一个神奇的工作示例 …
尝试这个
$('#D25,#E37,#E31,#F37,#E16,#E40,#F16,#F40,#E41,#F41').bind('DOMNodeInserted DOMNodeRemoved',function(){ // your code; });
不要使用这个。 这可能会导致页面崩溃。
$('mydiv').bind("DOMSubtreeModified",function(){ alert('changed'); });
尽pipe事件DOMSubtreeModified已被弃用，但它现在的工作，所以对于任何临时项目，您可以使用它作为以下。
$("body").on('DOMSubtreeModified', "#mydiv", function() { alert('changed'); });
从长远来看，你将不得不使用MutationObserver API。
