Question

我想模拟点击动态追加的元素。但我使用的代码不起作用。我不知道如何继续我的脚本。我在窗口的加载事件上使用了.trigger()方法。它不起作用。

代码：

$( function() {
    $.post("ajaxify.php", "name=Heart", function(html) {
        $("#menu ul").append("<li>"+html+"</li>");
    });
});
$(window).load( function() {
    $("#menu ul li").trigger("click");
});

Answer 1

将新的'li'元素添加到菜单中时，您可以触发单击该列表元素：

$('<li />').text('My text here').appendTo('#menu ul').trigger('click');

Answer 2

您模拟点击的代码是正确的，但是在错误的时间调用它。传递给$(window).load()的函数内部的代码在窗口加载完成后执行一次，并且只影响代码执行时存在的元素（因此不会动态添加代码）。

在添加动态添加的元素之后，您只需要调用该行代码，因此在AJAX调用的success回调函数结束时。

为了避免修改现有代码，如果它是页面上提交的唯一AJAX请求，则可以使用ajaxSuccess事件触发点击：

$(document).on('ajaxSuccess', function() {
    $('#menu ul li').trigger('click');
});

Answer 3

此方案的最佳竞争者是'on'方法。这适用于动态添加的元素

$('#menu').on('click', 'ul li' function() {  // ul li is the context passed to the funciton
 //do something
});

Answer 4

您可以使用jquery的on()方法为DOM中的某个元素注册事件。

模拟点击动态添加的元素

4 个答案: