jquery - 对集合中的所有项目仅触发一次单击

Question

我有一个包含许多字段的表单，我需要单击其中任何一个字段来触发模式。 对于每个整个表单，这种情况应该只发生一次，与单击哪个字段无关。

假设每个字段都由CSS类.form-control标识，我尝试使用jQuery .one()方法，这样:

$('.form-control').one('click',function(){
   $('#modal').modal();
});

这几乎运行正确，因为它肯定只在我第一次单击每个字段时打开模式，但如果我单击另一个字段，它会再次打开模式，这不是所需要的。

这里是working example有一个简单的示例，为了简单起见，我打开一个警报而不是模式。如果您单击第一个字段，则会打开警报，接下来单击同一字段不会执行任何操作(正确)，但单击第二个字段会再次触发它，这不是我需要的。

请问，如何限制模态打开仅限于首次单击任何字段？

Answer 1

您可以使用 jQuery off 删除事件处理程序方法，例如

$(function() {
  $('.form-control').on('click', function() {
    console.log('ok');
    $('.form-control').off('click');
  });
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<form>
  <input class="form-control">
  <input class="form-control">
</form>