时间戳

首页 > 解决方案 > JQuery $('form').serialize() 在 $('div.container').load() 之后不起作用

jquery - JQuery $('form').serialize() 在 $('div.container').load() 之后不起作用

问题描述

我有一个通过 AJAX 调用更新的 div 页面，如下所示：

<body>
    <div id="container">
        <div id="newinfo">
            <form id="selectform">
                Your name:<br>
                <input type="text" name="firstname"><br>
            </form> 
        </div>
    </div>
    <script>
        function reload_container() {
            $('#container').load('url/to/ajax/update');
            console.log($('#selectform').serialize());
        }
    </script>
</body>

加载响应是相同的（包括表单 ID），但内容不同。

如果我reload_container();从 Firefox 中的调试控制台运行，则该serialize()函数为空，但$('#selectform')确实已定义。

但是，我需要表格的内容。我不知道为什么$('#selectform')选择器在重新加载后会起作用，但serialize()不会。任何帮助深表感谢。

请注意，表单的输入确实包含名称标签。jQuery 序列化不起作用是不相关的。

更新：绑定到容器中元素的事件在 load() 之后也不起作用。例如$('#newinfo').click(function(){alert('hi!'});在身体负荷脚本中。然而，这可以通过jQuery .live() 与 .on() 方法解决，用于在加载动态 html 后添加点击事件

标签： jqueryformsserializationjquery-selectors

解决方案

您应该在加载完成处理程序中执行您的代码。

$('#container').load('url/to/ajax/update', function() {
  console.log($('#selectform').serialize());
});

在此处查看示例http://api.jquery.com/load/

推荐阅读