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)访问点击的元素：

Updated Example

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

使用id访问thid.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);
    });
});

Answer 2

作为替代方案，您可以使用：

<button id="1" onClick="reply_click(this.id)">B1</button>

保存jquery部分。

JS提醒ID：

function reply_click(clicked_id)
{
    alert(clicked_id);
}

干杯，

的Valentin

Answer 3

同样，你可以这样做：

<button id="btnId1234" class="btnClass123" onClick="reply_click(this.id, this.className)">Click Me</button>

function reply_click(cid, cclass)
{
    console.log(cid);
    console.log(cclass);
}

点击时获取课程ID

3 个答案:

没有jQuery：