在追加元素后刷新DOM

解决了：

主要问题是：

我觉得jquery太老了

解决了问题:)

添加DOM后为什么警报不起作用？ 点击它后应该显示“bla bla”。

        $(document).ready(function() { $('#main_body').append("
Hello
Click"); $( "#but" ).on( "click", function() { alert( "bla bla" ); }); });      

Answer 1

对于动态添加的元素，您需要事件委托，在jQuery on（）上使用其他版本，您可以将事件委托给动态添加元素的静态父级。 在您的情况下，您可以使用#main_body

 $('#main_body').on( "click", "#but", function() { alert( "bla bla" ); }); 

委托事件的优点是，它们可以处理来自稍后添加到文档的后代元素的事件。 通过选择在附加委托事件处理程序时保证存在的元素，您可以使用委派事件来避免频繁附加和删除事件处理程序， jQuery Docs的需要

您的代码在此处工作 ，因为您在绑定事件之前添加了动态元素，但使用事件委派将使您从用于添加动态元素的序列中解脱出来。

Answer 2

您需要使用事件委派来动态添加元素。

 $(document).ready(function() { $('#main_body').append("
Hello
Click"); $('#main_body').on('click', '#but', function() { alert( "bla bla" ); }); }); 

事件委托允许我们将单个事件侦听器附加到父元素，该元素将为匹配选择器的所有子项触发，无论这些子项现在是存在还是将来添加

Answer 3

像这样使用

你应该使用事件委托

它可以帮助您为动态创建的元素附加处理程序

Answer 4

你的代码应该工作

小提琴演示

 $(document).ready(function () { $('#main_body').append("
Hello
Click"); $("#but").on("click", function () { //element is in DOM now as it added in previous statement alert("bla bla"); }); });