Question

有两个页面，在webform3.html加载完成后，将webform4.html的页面内容的一部分添加到webform3.html的div中。但是当我单击Buttone4时，该事件不起作用。如何解决这个问题？非常感谢你！

WebForm3.html

<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
<title></title>
<script src="scripts/jquery-1.7.2.js" type="text/javascript"></script>
<script type="text/javascript">
    $(function () {
        $("#W4").load("WebForm4.html #CC");
        $("#Button4").click(function () {
            alert("webform4.html");
        })
    })
</script>
</head>
<body>
<form>
<div id="W4">
</div>
<input id="Button1" type="button" value="button" />
</form>
</body>
</html>

WebForm4.html

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
</head>
<body>
<div id="CC">
    <input id="Button4" type="button" value="button"/>
</div>
</body>
</html>

Answer 1

使用delegate()附加事件处理程序，或在回调中加载完成后附加它：

<script type="text/javascript">
    $(function () {
        $("#W4").load("WebForm4.html #CC", function () {
            $("#Button4").click(function () {
                alert("webform4.html");
            });
        });
    })
</script>

Answer 2

尝试使用 .on 而不只是 .click ：

$(function () {
    $("#W4").load("WebForm4.html #CC");
    $("#Button4").on("click", function () {
        alert("webform4.html");
    });
});

Answer 3

您可以使用此链接：load-remote-content-into-div-element

使用jquery加载页面的一部分

3 个答案: