尝试使用基于数组的 jquery 输出单独的单击函数

Trying to output separate click functions with jquery based on a array

本文关键字：jquery 输出 单独 函数 单击 数组 于数组      更新时间：2023-09-26

我有这个数组，它是根据图库中的图像自动生成的。我需要给它们所有单独的点击事件，这些事件在点击时从另一个数组输出变量，这样我就可以将它们传递到一个字符串中，该字符串附加到 url 的末尾以提交给 pinterest。让我滑倒的部分是点击事件，

这是代码，到目前为止，它只是提醒数组的最后一部分并执行两次，我希望每次单击都分别提醒第一次单击的第一个数组，第二次单击的第二个数组位置。

这是相应的数组控制台。logged，它是各个类的不同按钮要单击。

[".btnPinIt , 0", ".btnPinIt , 1"]
for (var j = 1; j < clickArray.length; j++){
    console.log(clickArray[j]);
    $(clickArray[j]).click(function() {
      alert(j);
    });
  }

一个问题是您的j对于所有处理程序都在同一范围内，因此在单击发生时具有 clickArray.length 的值，但您不应该为此需要单独的处理程序。对元素使用数据属性，并从单个处理程序中选取它们。

另一个是您将数组从 1 而不是 0 索引。

您

还需要一个具有有效选择器的数组，因为目前您有一个无效的 jQuery 选择器数组。

例如，假设您有一个 id 选择器数组：

  clickArray = ["#btnPinIt1",
                "#btnPinIt2"]
  // save the index values on the elements
  for (var j = 0; j < clickArray.length; j++){
    $(clickArray[j]).attr('data-val', j+1);
  }
  // Use a startswith selector (in this example) to handle the clicks
  $("[id^=btnPinIt]").click(function() {
      alert($(this).data('val'));
  });

更简单的仍然是使用您的类并按从 1 到 n 的顺序对它们进行索引：

  $('.btnPinIt').each(function(e, i){
      $(this).attr('data-val', i+1);
  }).click(function() {
      alert($(this).data('val'));
  });

这也链接了click和each。

相关文章：