Question

我有以下内容：

<form id="form" action="xxx" method="get">
  <input type="checkbox" name="cb">
  <button onclick="update();">Update</button>
</form>

<script>
  function update() {
    var data = $("#form").serialize();
    $.ajax( {
      url: "/api/m/x",
      type: "post",
      data: data
      }
     ).done(function(results,status) {
          alert(status);
       }).fail(function(error, status) {
          alert(status);
      });
   }
</script>

当我点击“更新”按钮时，对/api/m/x进行了Ajax调用，并触发了其中一个警报。到现在为止还挺好。但是，在我关闭警报对话框后，表单已提交！浏览器将发送到xxx?cb=on，例如，如果我勾选复选框。

为什么会这样？我的表单没有<input type='submit'>元素。谁在触发提交表单？

我尝试将return false;添加到update函数，但行为仍然相同。

Answer 1

如果您有表单中的按钮，则单击此按钮时会提交表单

尝试这样：

<form onsubmit="update();return false;">

Answer 2

除非您指定<button>，否则表单中的type=button标记是提交按钮返回false也应该在onsubmit事件

上

<form id="form" action="xxx" method="get" onsubmit="return update();">

function update() {
...
    return false;
}

为什么我的FORM在Ajax调用后被提交？

2 个答案: