jquery：从类选择器获取id

Question

有什么方法可以从类似以下内容获取元素的 id：

<a href="#" class="test" id="test_1">Some text</a>
<a href="#" class="test" id="test_2">Some text</a>
<a href="#" class="test" id="test_3">Some text</a>

然后绑定

$('.test')

那么当我单击其中一个元素时我会返回 id 吗？

Answer 1

哦..如果我没听错的话，它应该很简单：

$('.test').click(function() {
  console.log(this.id);
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<a href="#" class="test" id="test_1">Some text</a>
<a href="#" class="test" id="test_2">Some text</a>
<a href="#" class="test" id="test_3">Some text</a>

您只需在事件处理程序内通过底层 dom 节点访问id 属性即可。

Answer 2

在jquery中使用“attr”方法。

$('.test').click(function(){
    var id = $(this).attr('id');
});

Answer 3

当您添加点击事件时，this 返回已被点击的元素。所以你可以只使用 this.id;

$(".test").click(function(){
   alert(this.id); 
});

示例： http://jsfiddle.net/jonathon/rfbrp/

Answer 4

从 jQuery 1.6 开始，您可以（有些人会说应该）使用 .prop 而不是 .attr

$('.test').click(function(){
    alert($(this).prop('id'));
});

这篇文章将进一步讨论：.prop() 与 .attr()

Answer 5

如果您使用粗箭头函数，请务必小心，因为 this.id 将变得未定义
今天浪费了10分钟想知道到底发生了什么

Answer 6

$(".class").click(function(){
    alert($(this).attr('id'));
});

只有在 jquery 按钮上单击我们才能执行该类应该写在那里

Answer 7

这个例子中没有任何内容对我有用

for (var i = 0; i < res.results.length; i++) {
        $('#list_tags').append('<li class="dd-item" id="'+ res.results[i].id + '"><div class="dd-handle root-group">' + res.results[i].name + '</div></li>');
}

    $('.dd-item').click(function () {
    console.log($(this).attr('id'));
    });