独立使用2个按钮对表单进行ajax和POST验证

在此示例中，我们使用jQuery库来轻松完成这项任务。

HTML表单：

<form id="myForm" method="POST" action="submit.php">
  <input type="text" name="username">
  <input type="text" name="email">
  <button id="validateBtn" type="button">验证</button>
  <button id="submitBtn" type="button">提交</button>
</form>

jQuery代码：

$(function() {

  // 验证表单
  $('#validateBtn').click(function() {
    var formData = $('#myForm').serialize(); // 获取表单数据
    // 发送ajax请求
    $.ajax({
      url: 'validate.php',
      type: 'POST',
      data: formData,
      success: function(response) {
        // 处理响应
        if (response === 'valid') {
          alert('表单验证通过！');
        } else {
          alert('请检查表单并重新提交！');
        }
      }
    });
  });

  // 提交表单
  $('#submitBtn').click(function() {
    var formData = $('#myForm').serialize(); // 获取表单数据
    // 发送ajax请求
    $.ajax({
      url: 'submit.php',
      type: 'POST',
      data: formData,
      success: function(response) {
        // 处理响应
        if (response === 'success') {
          alert('表单提交成功！');
        } else {
          alert('表单提交失败！');
        }
      }
    });
  });

});

在上面的代码中，我们使用了两个按钮来处理表单验证和提交操作。每个按钮都有一个点击事件处理程序。当用户单击“验证”按钮时，我们将表单数据序列化并将其发送到服务器进行验证。服务器将响应“valid”或“invalid”，我们在处理程序中处理响应并向用户显示相应的消息。类似地，当用户单击“提交”按钮时，我们将表单数据序列化并将其发送到服务器进行处理。服务器将响