javascript - 在两个不同的点击事件之间传递数组值

Question

如何使用 jQuery 将数组中的值从一个事件单击传递到另一个？

这是我想做的一个例子:如果输入复选框被选中，第一次点击事件会在数组中添加或删除值。在第二次点击时，我想遍历该数组的所有元素。

var array=[];
 $( "input" ).on( "click", function() {
  var $input=$(this)
  if($input.is(":checked")){
  array.push($(this).val()); //append check box value to array if is selected
  }
else{
   array.pop($(this).val()); // remove check box value to array if is not selected
  }

 })
$('#cmd').click(function() {
     for (i of array) {
        console.log(array[i]); // loop trough all elements in array
    ...
});

Answer 1

除了两点，您的代码看起来还不错。首先是 for (i of array) .使用 of将返回实际值 i ，但您在 array[i] 中使用值作为索引.

如果你想使用索引，那么使用 for (let i = 0; i < array.length; i++)相反。

您还可以使用 Array.prototype.forEach()但你无法跳出它的循环 https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/forEach

第二件事是.pop()不支持参数。使用下面的代码代替 .pop()

var index = array.indexOf($input.val());
if (index > -1) {
  array.splice(index, 1);
}

如果您的事件处理程序在不同的范围内并且 #cmd处理程序看不到 array .您可能会使用这个有点糟糕的解决方案来在范围之间共享数组:)

$("input").on( "click", function() {
  var array = $("#cmd").data("arr") || [];

  var $input= $(this);
  var value = $input.val();
  if($input.is(":checked")){
    array.push(value); /
  } else {
    var index = array.indexOf(value);
    if (index > -1) {
      array.splice(index, 1);
    }
  }

  $("#cmd").data("arr", array);
});

$('#cmd').click(function() {
     var array = $(this).data("arr") || [];
     for (let value of array) {
        console.log(value); // loop trough all elements in array
     }
});