Question

<div>
    <ul>
        <li><a id="Tab1" href="">Tab1</a></li>
        <li><a id="Tab2" href="">Tab2</a></li>
        <li><a id="Tab3" href="">Tab3</a></li>
        <li><a id="Tab4" href="">Tab4</a></li>
    </ul>
</div>
<script>
$(document).ready(function() {
    $("a").click(function() {
        var IdName = $("a").attr('id');
        alert(IdName);
    });
});
</script>

When I click the hyperlink, it always shows id of the first hyperlink. Why ? How can I solve it ?

Answer 1

在事件处理程序中，this是您想要的元素。

更改

var IdName = $("a").attr('id');

到

var IdName = this.id;

注意：使用$(this).attr('id')没有任何意义，这是无用的慢速和冗长，总是使用直接this.id。

Answer 2

您可以在$(this)事件处理程序中使用click。事件处理程序中的$(this)是单击的anchor。

$("a").on('click', function() {
    alert($(this).attr('id'));
    // return false OR e.preventDefault to stop redirection
});

Answer 3

您正在attr()上调用$('a')，这将为您提供第一个匹配元素的属性。使用$(this)获取当前点击的锚标记

$(document).ready(function(){
      $("a").click(function(){
          var IdName = $(this).attr('id');
          alert(IdName);
      }); 
});

获取<a> selector using jquery

3 个答案: