Javascript 如何使用一个提交按钮提交三个表单

我有3份表格，我想通过一个按钮提交：

<form id="#formEditUsername">
//Code
</form>

<form id="#formEdituseremail">
//Code
</form>

<form id="#new_password_form">
//Code
</from>

<button type="submit" class="btn btn-success" id="btnUpdate">Save</button>

//代码
//代码
//代码
拯救

我知道最好的方法可能是Ajax，但我不确定我会怎么做；为前两个表单创建两个AJAX函数，然后在提交第三个表单时调用这些函数？

试试这个

 $(document).ready(function() {
        $("#btnUpdate").click(function() {
            $.post($("#formEditUsername").attr("action"), $("#formEditUsername").serialize(),
              function() {
                $.post($("#formEdituseremail").attr("action"), $("#formEdituseremail").serialize(),
                  function() {
                    $.post($("#new_password_form").attr("action"), $("#new_password_form").serialize(),
                       function() {
                        alert('All forms submitted');
                      });                
                  });
              });
          });
      });

---

正如@Jari所提到的，您只需从前两个表单收集数据并一起提交即可

注意：此方法要求输入的

名称

属性在所有三种表单中都是唯一的

AJAX调用的简单示例：

var firstFormData = $("#formEditUsername").serialize();
var secondFormData = $("#formEdituseremail").serialize();
var thirdFormData = $("#new_password_form").serialize();

$.post(
    URL,              // target URL of your choice 
    firstFormData + secondFormData + thirdFormData
);

//代码
//代码
//代码
$（文档）.ready（函数（）{
$（“#b更新”）。单击（函数（）{
$（“.frmToSubmit”）.submit（）；
});
});

我可以问一下为什么要这样做吗？要显示三个表单还是提交？从输入标记中收集值，然后用它们填充第三个表单并提交。这可能有效，但看起来像。请考虑以更干净的方式重写。谢谢，但是表单功能是离散的；我想提交3个不同的表单，而不是将它们连接成一个表单？请进一步详细说明您计划在服务器端进行哪些处理。不知道这一点，很难说哪种解决方案最适合你。

<form id="#formEditUsername" class="frmToSubmit" method="post">
//Code
</form>

<form id="#formEdituseremail" class="frmToSubmit" method="post">
//Code
<form>

<form id="#new_password_form" class="frmToSubmit" method="post">
//Code
</from>

<script type="text/javascript">
$(document).ready(function() {
    $("#btnUpdate").click(function() {
        $(".frmToSubmit").submit();
    });
});
</script>