时间戳

首页 > 解决方案 > js中的for循环记录另一个索引

javascript - js中的for循环记录另一个索引

问题描述

我做了类似下面显示的代码：

for(var is = 1; is <= 10; is++) {
  $('#add1-' + is).click(function () {
    console.log(is);
  });
}

当我单击按钮 id=add1-1控制台日志显示 is=11 和相同的add1-2, index name is= 11 什么可以解决这个问题？

标签： javascriptjquery

解决方案

如果你真的想做一个循环，你将不得不做这样的事情：

for (var is = 1; is <= 10; is++) {
  $('#add1-' + is).on('click', {is}, function(e) {
    console.log(e.data.is);
  });
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="add1-1">click me 1</div>
<div id="add1-2">click me 2</div>
<div id="add1-3">click me 3</div>

但是，这样做会更好：

$('[data-is]').on('click', function(e) {
  console.log($(this).data('is'));
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div data-is="1" id="add1-1">click me 1</div>
<div data-is="2" id="add1-2">click me 2</div>
<div data-is="3" id="add1-3">click me 3</div>

data-属性允许您将数据绑定到元素，并且比为此目的使用 ID 本身更合适。在文档中阅读它们。

推荐阅读