Jquery 输入 ID 数组检测变化

Question

我有一个关于检测输入 ID 数组中输入变化的问题。

例如我有一个输入 ID 数组：var arrayOfInputs = ['#firstname', '#lastname', '#email', '#phone'];

我的问题是我想检测这些字段中的任何输入更改，但我不想分别为每个输入字段编写庞大的脚本代码。

所以问题是：是否有一种方法可以通过 jQuery 的一两行代码来检测数组中所有这些输入的输入变化？

也许我应该使用 ID 数组以外的其他东西？

Answer 1

您可以使用 each() 在排序代码中执行这些操作。

var arrayOfInputs = ['#firstname', '#lastname', '#email', '#phone'];
$.each(arrayOfInputs, function(index, data){
  $(data).on('change',function(){
     alert($(this).val());
  });
});

Answer 2

So question is: do there is a way to detect input change for all these inputs in array with one or two lines of code with jQuery?

是：

$(arrayOfInputs.join(",")).on("change", function() {
    // Here, `this` will refer to the input that changed
});

现场演示:

var arrayOfInputs = ['#firstname', '#lastname', '#email', '#phone'];
$(arrayOfInputs.join(",")).on("change", function() {
  snippet.log(this.id + " changed");
});

<div><input type="text" id="firstname"></div>
<div><input type="text" id="lastname"></div>
<div><input type="text" id="email"></div>
<div><input type="text" id="phone"></div>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<!-- Script provides the `snippet` object, see http://meta.stackexchange.com/a/242144/134069 -->
<script src="http://tjcrowder.github.io/simple-snippets-console/snippet.js"></script>

Maybe I should use something other than array of IDs?

是的，给他们一个共同的 class 或 data-* 属性或其他东西，而不是列出 ID。

现场演示:

$(".watch-me").on("change", function() {
  snippet.log(this.id + " changed");
});

<div><input type="text" class="watch-me" id="firstname"></div>
<div><input type="text" class="watch-me" id="lastname"></div>
<div><input type="text" class="watch-me" id="email"></div>
<div><input type="text" class="watch-me" id="phone"></div>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<!-- Script provides the `snippet` object, see http://meta.stackexchange.com/a/242144/134069 -->
<script src="http://tjcrowder.github.io/simple-snippets-console/snippet.js"></script>

Jquery 输入 ID 数组检测变化

Jquery array of input IDs detect change

javascript

arrays

jquery

input

detect