jqueryajax表单将只绑定一次以提交

我有两个问题。如果我直接加载我的页面，我的表单将只提交一次。如果我以模式加载表单，它将根本不会提交

如果成功，我希望重新显示表单（通过ajax加载），并且仍然让脚本重新绑定到表单

HTML/jQuery已编辑

 <div class="modal-content">
      <form id="userSignUp">{{FORM ELEMENTS}}
      <input type="submit" onclick="submitForm('#userSignUp',event)">
  </form>
 </div>
 <script>
 function submitForm(formID,e){
        //e.preventDefault(); //STOP default action 
        var postData = $("#"+formID).serializeArray();
        var formURL = $("#"+formID).attr("action");
        alert(formID);
        $.ajax(
        {
            url : formURL,
            type: "POST",
            data : postData,
            cache: false,
            success:function(data, textStatus, jqXHR) 
            { 
                $('.modal-content').html(data);
            },
            error: function(jqXHR, textStatus, errorThrown) 
            { 
                $('.signUpError').html('<div class="alert alert-warning">There was a problem communicating with the site. Refresh the page and try again.</div>');
            }
        });

        e.preventDefault(); //STOP default action 
    }
 </script>

{{FORM ELEMENTS}}
函数提交表单（formID，e）{
//e、 preventDefault（）；//停止默认操作
var postData=$（“#”+formID）.serializeArray（）；
var formURL=$（“#”+formID）.attr（“操作”）；
警报（formID）；
$.ajax(
{
url:formURL，
类型：“POST”，
数据：postData，
cache:false，
成功：函数（数据、文本状态、jqXHR）
{ 
$（'.modal content'）.html（数据）；
},
错误：函数（jqXHR、textStatus、errorshown）
{ 
$（'.signUpError'）.html（'与站点通信时出现问题。请刷新页面，然后重试'）；
}
});
e、 preventDefault（）；//停止默认操作
}

---

编辑：我已经更新了脚本-但现在的问题似乎是每次表单提交时，它都希望使用第一个表单中提交的数据。它似乎没有重新序列化已提取的数据。

因为您的表单是动态元素，请对动态元素使用绑定：

而不是

$("#userSignUp").submit(function(){});

使用

---

我只想这样做：

  <form id="userSignUp">

    <div class="modal-content">
      {{FORM ELEMENTS}}
   </div>
  </form>

{{FORM ELEMENTS}}

这样，您就不必重新绑定表单和新内容

  <form id="userSignUp">

    <div class="modal-content">
      {{FORM ELEMENTS}}
   </div>
  </form>