javascript - 单击时获取带有类的 id

Question

此代码假设显示 <a> 的警报元素 id通过class单击它时的名称。出于某种原因，我总是得到 tuto1警报。怎么了？

$(document).ready(function() {
  $(".viewID").click(function() {
    alert($('.viewID').attr('id'));
  });
});

<ul>
  <li><a id="tuto1" class="viewID">Dolor irure velit commodo cillum sit nu</a>
  </li>
  <li><a id="tuto2" class="viewID">Text, text and more text</a>
  </li>
  <li><a id="tuto3" class="viewID">consequat occaecat fugiat in adipisicing</a>
  </li>
</ul>

演示 http://jsfiddle.net/7ku0f7we/1/

Answer 1

这是因为您正在访问 jQuery 对象中第一个元素的 id。

使用 $(this) 访问 clicked 元素:

Updated Example

$(".viewID").on('click', function () {
    alert($(this).attr('id'));
});

不过，使用 thid.id 访问 id 更简单:

Example Here

$(".viewID").on('click', function () {
    alert(this.id);
});

---

没有 jQuery:

Example Here

Array.prototype.forEach.call(document.querySelectorAll('.viewID'), function (el) {
    el.addEventListener('click', function () {
        alert(this.id);
    });
});