使用Jquery动态加载的html类

我有一个带有类产品div的动态加载页面。 Jquery没有使用下面的代码看到这个类。 当我点击产品divs时它没有做任何事情。 然而，导航元素上的陈词滥调很好。 有什么方法可以使它吗？

$(document).ready(function(){ $(".nav-element").click(function(){ var id = $(this).attr('id'); alert(id); $(".nav-element").css("background", "#fff"); $("#"+id).css("background", "#A4CFBE"); $(".content-white").load(id+".html"); }); $(".content-white").load("nav-element1.html"); $(".product").click(function(){ alert("poop"); }) }); 

Answer 1

尝试委托事件处理程序

 $(document).ready(function () { $(".nav-element").click(function () { var id = $(this).attr('id'); alert(id); $(".nav-element").css("background", "#fff"); $("#" + id).css("background", "#A4CFBE"); $(".content-white").load(id + ".html"); }); $(".content-white").load("nav-element1.html"); // event delegation to the closest static element $(".content-white").on('click', ".product", function () { alert("poop"); }); }); 

Answer 2

一个动态加载的页面，包含类产品的div

您需要使用事件委派 。 您必须使用委托事件方法使用.on（） 。

即

 $(document).on('event','selector',callback_function) 

理想情况下，您应该用最近的静态容器替换document 。 这里是".content-white"

例

 $(".content-white").on('click', '.product', function () { alert("poop"); });