javascript - 使用 jQuery .class 选择器获取数据属性

Question

我想为整个类的元素触发一个 onClick 事件。通常，我会做这样的事情:

$(".classy").click(function(){
    console.log("Replace this line with something useful!");
});

但是，此类的每个元素都有我想在 onClick 函数中使用的不同数据属性。例如:

<div className="classy" data-num={100}></div>
<div className="classy" data-num={931}></div>
<div className="classy" data-num={777}></div>

在单击每个元素时，我想记录 data-num 值。有没有办法用 jQuery 的 .click 来做到这一点？

Answer 1

这里是解决方案 https://jsfiddle.net/Lk0pnu8e/

$(".classy").click(function(){
    console.log("First Way: " + $(this).attr('data-num'));
    console.log("Second Way: " + $(this).data('num'));
    console.log("Replace this line with something useful!");
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="classy" data-num={100}>100</div>
<div class="classy" data-num={931}>931</div>
<div class="classy" data-num={777}>777</div>