在.load()调用[duplicate]之后,jQuery按ID访问元素

vfwfrxfs  于 2022-12-12  发布在  jQuery
关注(0)|答案(3)|浏览(98)

此问题在此处已有答案

How to select an element loaded through the jQuery load() function?(2个答案)
6年前关闭。

$(document).ready(function() {
    $("img.tile").click(function() {
    var actid = $(this).data().id;
    $("#lz").load("/dialog/pre?actid=" + actid);
    $("#btnCheck").click(function() {
        alert("test");
    });
});

load()调用引入了一个HTML片段,其中包含<input id="btnCheck" value="Check" />,但当我单击它时,事件没有触发。这一定与片段的加载方式有关。如何实现这一点?

dbf7pr2w

dbf7pr2w1#

正确,您需要在确定数据已加载后附加click事件,或者使用live事件附加它。如果live现在或将来发现处理程序,它将附加该处理程序,并且可能是最容易实现的:

$("#btnCheck").live('click', function() {
    alert("test");
});

或者,你也可以在确定数据已经加载之后再附加它。正如@bzlm在他的注解中指出的,load是一个异步事件,所以你不能假设它已经在任何后续代码中完成。幸运的是,load允许你传递一个函数作为第二个参数,它将在所有数据加载之后触发:

$("#lz").load("/dialog/pre?actid=" + actid, function() {
    $("#btnCheck").click(function() {
        alert("test");
    });
});
wlp8pajw

wlp8pajw2#

最好的方法是使用delegate并利用事件冒泡来捕获可能还不存在的元素上的事件。这非常容易,尤其是当您可以在现有的选择上工作以提供上下文时:

$(document).ready(function () {
    $("img.tile").click(function () {
        var actid = $(this).data().id;
        $("#lz")
            .load("/dialog/pre?actid=" + actid)
            .delegate("#btnCheck", "click", function () {
                alert("test");
            });
    });
});

这在功能上等同于load示例,但在几个方面性能稍好。

voase2hg

voase2hg3#

试试看:

$(document).ready(function() {
    $("img.tile").click(function() {
    var actid = $(this).data().id;
    $("#lz").load("/dialog/pre?actid=" + actid);
    $("#btnCheck").live('click', function() {
        alert("test");
    }); });

这将在load事件之后拾取添加到dom中的任何元素。

相关问题