javascript - 关注表单中的所有元素

Question

我有一个包含 10 个输入字段的表单(下面并未包含所有输入字段)。我正在尝试使用 jQuery focusout 函数触发事件。例如，表单名称为:form_test

<form id="form_test">
    <input name="customer_id" id="customer_id" hidden>
    <input name= "customer_name" id= "customer_name" type="text" class="form-control" placeholder="Company Name">
</form>

我希望发生的是，无论他们点击哪个输入框，点击后，焦点事件都会发生。

Answer 1

每次输入获得焦点然后焦点被移除时，focusout事件都会触发。下面的代码片段展示了如何绑定(bind)到该事件。

$(function() {

  // Using the id
  $("#form_test input").on('focusout', function() {
    console.log("focusout event triggered using the id!");
  });

  // Using the name
  $("form[name='form_test'] input").on('focusout', function() {
    console.log("focusout event triggered using the name!");
  });

});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<form name="form_test" id="form_test">
  <input name="customer_id" id="customer_id" hidden>
  <input name="customer_name" id="customer_name" type="text" class="form-control" placeholder="Company Name">
</form>