Question

我有一个表单，当单击“提交”按钮时，它将发送一个AJAX请求。这适用于单击按钮的方式：

$(#form).submit(function(event) {
  event.preventDefault();
  $.ajax({
    // ...
  })
});

表单数据使用data通过ajax命令传递到URL。

有没有一种方法可以提交此表单，并且可以在下拉更改javascript / jQuery事件上运行相同的AJAX函数？下拉菜单的格式相同。

我拥有它，以便AJAX成功返回时，它会添加HTML，以用div填充table，因此需要编写一次。

Answer 1

简短的回答：“是”。您可以在任意位置调用表单的“提交”方法。例如：

$("#someDropdown").change(function() { $("#form").submit(); });

演示：

$(function() {
  $("#someDropdown").change(function() {
    $("#form").submit();
  });

  $("#form").submit(function(event) {
    event.preventDefault();
    console.log($(this).serialize());
  });
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<select id="someDropdown">
  <option>Option 1</option>
  <option>Option 2</option>
</select>
<hr>
<form id="form">
  <input type="text" name="text1" />
  <button type="submit">Submit</button>
</form>

文档：https://api.jquery.com/submit/

提交包含多个事件的AJAX表单

1 个答案: