Question

以下代码可以正常工作：

$(document).on('click', "input[id='inputfield0']",
   function() {
      myFunction(0); 
});

$(document).on('click', "input[id='inputfield1']",
   function() {
      myFunction(1); 
});

$(document).on('click', "input[id='inputfield2']",
  function() {
     myFunction(2); 
})

我要删除重复项，如下：。

 function oneCall() {
    for (var i = 0; i < 2; i++) {
       $(document).on('click', "input[id='inputfield"+i+"']",
          function() {
             myFunction(i); 
          });
    }
 }

function oneCall();

但是，在新函数oneCall()中，每次在循环中调用myFunction()时，都将其传递的值为2，而不是在每次调用时递增。重组此代码的正确方法是什么？

谢谢

Answer 1

为每个输入添加一个类，并在该类上添加侦听器。

function myFunction(v) {
  console.log(v);
}

$('.click-listener').on('click', function(e) {
  let $target = $(e.target),
      id = parseInt($target.attr('id').split('-')[1], 10);
  myFunction(id);
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input id="inputfield-0" class="click-listener" />
<input id="inputfield-1" class="click-listener" />
<input id="inputfield-2" class="click-listener" />

为JavaScript函数调用增加值的正确方法

1 个答案: