Jquery 在 div 外部点击时自动提交

Question

当用户点击 div 外部时自动提交表单的最简单方法是什么？ 只需考虑 div 而不是表单元素。

<div id="formDiv">
<form id="search">
  <input id="target" type="text" value="Field 1" />
  <input type="text" value="Field 2" />
</form>
</div>

Answer 1

您可以添加 click处理程序至document 未在 <div> 内激活，像这样:

$(document).click(function() {
  $("#search").submit();
});
$("#formDiv").click(function(e) {
  e.stopPropagation();
});

它的作用是点击document ，结果为<form id="search">正在提交，但来自<div>内部我们阻止click事件从到达(冒泡至)document通过 event.stopPropagation() .

如果#search表单有时可能会隐藏，您只想在显示时启动它，例如，没问题，只需添加 :visible 到选择器，如下所示:

$("#search:visible").submit();