Javascript Can'；在返回的HTML上找不到表单

我有一个主页，由一个链接和一个id为“containerDiv”的div组成。 当您按下链接时，它将使用Ajax从另一个页面加载一些HTML到这个div中

返回的HTML包含一个表单。提交表单时，我希望停留在同一页面上，并在div中显示生成的内容

主页上的脚本：

<script type="text/javascript">
    $(document).ready(function () {
        $("a").click(function () {
            $('#containerDiv').load(this.href + ' #contentDiv', function () {
                alert($('#page2Form').id);
                $('#page2Form').submit(function () {
                    $.post(
                    pageName,
                    this.serialize(),
                    function (data) {
                        if (data.success)
                            alert('done');
                        else
                            alert('error');
                        $('#containerDiv').html(data);
                    }
                );
                    return false;
                });
            });
            return false;
        });
    });
</script>

<a id="link1" href="page1.aspx">Page 1</a>
    <br />
    <div id='console' style="border: 2px solid red; width: 1000px">
        when the link is clicked this content is replaced with new html.
    </div>

$（文档）.ready（函数（）{
$（“a”）。单击（函数（）{
$（'#containerDiv'）.load（this.href+'#contentDiv'，函数（）{
警报（$（'#page2Form'）.id）；
$（'#page2Form'）。提交（函数（）{
美元邮政(
页码，
这是一个.serialize（），
功能（数据）{
if（data.success）
警报（“完成”）；
其他的
警报（“错误”）；
$（'#containerDiv'）.html（数据）；
}
);
返回false；
});
});
返回false；
});
});

主页上的相关HTML：

<script type="text/javascript">
    $(document).ready(function () {
        $("a").click(function () {
            $('#containerDiv').load(this.href + ' #contentDiv', function () {
                alert($('#page2Form').id);
                $('#page2Form').submit(function () {
                    $.post(
                    pageName,
                    this.serialize(),
                    function (data) {
                        if (data.success)
                            alert('done');
                        else
                            alert('error');
                        $('#containerDiv').html(data);
                    }
                );
                    return false;
                });
            });
            return false;
        });
    });
</script>

<a id="link1" href="page1.aspx">Page 1</a>
    <br />
    <div id='console' style="border: 2px solid red; width: 1000px">
        when the link is clicked this content is replaced with new html.
    </div>

单击链接时，此内容将替换为新的html。

内容页上的相关HTML：

    <div id="contentDiv">
        <form id="page2Form" runat="server">
        <div>
            <h1>
               Page 2</h1>
            <asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>
            <asp:Button ID="Button1" runat="server" Text="submit" OnClick="Submit_OnClick" />
        </div>
        </form>
    </div>

第2页

问题是在返回的HTML中找不到表单“page2Form”

警报（$（'#page2Form'）.id）；返回“未定义”

---

可能与未加载到DOM中的元素有关。

在这里，jQuery对象没有

.id

属性，您需要匹配集中第一个元素的

id

，如下所示：

alert($('#page2Form')[0].id);
//or without jquery:
alert(document.getElementById('page2Form').id);

alert($('#page2Form', data)[0].id);

另外，确保您在

$（'#containerDiv'）.html（数据）之后查找它调用，因此它被添加到DOM中。如果要在添加之前查找，请使用返回的
数据
作为要查找的上下文，如下所示：

alert($('#page2Form')[0].id);
//or without jquery:
alert(document.getElementById('page2Form').id);

alert($('#page2Form', data)[0].id);

警报（$（'side2Form'，data1）[0]）@user484204-您的代码具有
page2Form
您的评论具有
side2Form
…它是哪一个？：）@user484204-是
数据
还是
数据1
？这也改变了。$（'side2form'）.submit（函数（）{$.post（'side2form.aspx'，this.serialize（），函数（data）{if（data.success）警报（'done'））；else alert（'error'）；$（'#containerDiv'）.html（数据）；}）；返回false；}）@user484204-您正在查找元素，而不是页面加载。