Javascript Jquery序列化表单未初始化，

我通过jquery load加载表单，它填充了content div，表单等显示良好，但当我用值更新表单时，它不会触发我的

（“提交”

我的jquery

<!-- process update profile form without refreshing, then load the div with the new information !-->
    $("#content").on("submit", "#update_profile_form", function() {
        alert("jfjf");
        $.ajax({
            type: $(this).attr('method'),
            url: $(this).attr('action'),
            headers: {'X-Requested-With': 'XMLHttpRequest'}, 
            data: $(this).serialize(),
            success: function(data) {
                if(data.success == "false"){
                    $.notify(data.error, "error");
                }else{
                    $.notify(data.success, "success");
                    $("#content").load("<?php echo Config::get('URL'); ?>user" + " #inner_main_content");
                }
            }
        });
            return false; <!-- important: prevent the form from submitting !-->
    });
    <!-- end process update profile form without refreshing, then load the div with the new information !-->

提交时的警报触发器甚至没有弹出，这让我觉得它没有触发，而且我也没有收到任何错误。我正在将提交时的警报触发器绑定到内容id，因为它加载到的是主div，所以我如何初始化表单才能工作

---

以下是完整的表格：

我不确定是否清楚了解您的整个体系结构，也不确定您的问题的确切情况，但以下是我如何总结我所了解的内容：

• #内容

  部分包括

  #提交

  元素

• #content

  部分首先是初始页面的直接内容，并且是功能性的（提交时触发）

• 提交时，

  #内容

  部分将被

  .load（）

  过程覆盖
• 然后，

  #内容

  部分变得不起作用（提交时不会发生任何事情）

如果确实是这样，那么问题就相当“正常”：加载新的

#content

时，附加到

#content

的

submit

事件将丢失（很抱歉重复，但它来自您选择的id！）。
即使新内容还包含一个

#submit

元素，但该元素现在没有附加任何事件

一种解决方案是在加载新内容后再次执行附件，如下所示：

function attachSubmit() {
    $("#content").on("submit", "#update_profile_form", function() {
        alert("jfjf");
        $.ajax({
            type: $(this).attr('method'),
            url: $(this).attr('action'),
            headers: {'X-Requested-With': 'XMLHttpRequest'}, 
            data: $(this).serialize(),
            success: function(data) {
                if(data.success == "false"){
                    $.notify(data.error, "error");
                }else{
                    $.notify(data.success, "success");
                    $("#content").load("<?php echo Config::get('URL'); ?>user" + " #inner_main_content");
                    attachSubmit(); // <<-- here we attach event again to new content
                }
            }
        });
            return false; <!-- important: prevent the form from submitting !-->
    });
}

// Here #parent is supposed to be a parent of #content
// The on() method got a #submit arg, as selector for delegation
    $("#parent").on("submit", "#submit", "#update_profile_form", function() {
        alert("jfjf");
        $.ajax({
           // ... same as YOUR previous version (nothing added)
        });
            return false; <!-- important: prevent the form from submitting !-->
    });

---

您是通过

ajax

加载

#content

div，还是在

DOM

加载过程中会出现？当页面加载/单击链接时，通过jquery.load加载？所以即使是

#content

也是通过

ajax

加载的？我的意思是

.load

。确定要加载到哪个

div

上吗？噢，对不起，正在加载内容首先，在提交

表单时，尝试将
#内容
替换为
$（文档）
function attachSubmit() {
    $("#content").on("submit", "#update_profile_form", function() {
        alert("jfjf");
        $.ajax({
            type: $(this).attr('method'),
            url: $(this).attr('action'),
            headers: {'X-Requested-With': 'XMLHttpRequest'}, 
            data: $(this).serialize(),
            success: function(data) {
                if(data.success == "false"){
                    $.notify(data.error, "error");
                }else{
                    $.notify(data.success, "success");
                    $("#content").load("<?php echo Config::get('URL'); ?>user" + " #inner_main_content");
                    attachSubmit(); // <<-- here we attach event again to new content
                }
            }
        });
            return false; <!-- important: prevent the form from submitting !-->
    });
}

// Here #parent is supposed to be a parent of #content
// The on() method got a #submit arg, as selector for delegation
    $("#parent").on("submit", "#submit", "#update_profile_form", function() {
        alert("jfjf");
        $.ajax({
           // ... same as YOUR previous version (nothing added)
        });
            return false; <!-- important: prevent the form from submitting !-->
    });