Question

我有下一个代码：

$(document).ready(function(){    
$('#dl-cat').mouseenter(function(){
    $.ajax({
        type: "POST",
        url: "../control/Controlador.php",
        data: {lang: $('html').attr('lang'), cat: $(this).text(), prov: "none"},
        success: function(resp) {
            $(".og-grid").html(resp); 
        }
    });       
});

$(".og-grid li").on("mouseenter", function(){
    console.log("it exists");
});

}）;

“og-grid”类是“ul”标签，在ajax响应之后我放了一些类似“li”标签的html代码，但是当我将一个像“mouseenter”这样的事件编程到新添加的代码时没有告诉我什么，如果它不存在

Answer 1

您需要在此使用.on()的事件委派模型，因为li元素是动态的

$(".og-grid").on("mouseenter", 'li', function(){
    console.log("it exists");
});

Answer 2

您必须使用事件选择器。重写你的第二个事件监听器如下：

$(".og-grid").on("mouseenter", "li", function(){
   console.log("it exists");
});

Answer 3

您需要初始化mouseenter事件。假设我有<ul><ul>。在1 ajax调用之后，我有<ul><li><ul>，此时您需要在<li>上初始化事件。如果您以后有2 <li>，则需要再次初始化新添加的。{/ p>

如何从ajax响应中添加元素

3 个答案: