Question

我有这段代码：

<button class="remove" value="1" />
<button class="remove" value="2" />
<button class="remove" value="3" />

$(document).on('click', ".remove", function(e) {
    alert($(this).index());
});

始终提醒0。如果用户点击了值button的{{1}}，则必须提醒2，但在我的代码中，它会提醒1。

Answer 1

取决于你想要最终实现的目标并假设：

<button class="remove" value="34" data-myval="a"/>
<button class="remove" value="33" data-myval="b"/>
<button class="remove" value="32" data-myval="c"/>

如果你想获得'value'的值：

$(document).on('click', ".remove", function(e) {
    alert($(this).val());
});

如果你想获得点击内容的索引：

$(document).on('click', ".remove", function(e) {
    alert($(this).index());
});

如果您想获得自定义值：

$(document).on('click', ".remove", function(e) {
    alert($(this).data('myval'));
});

Answer 2

正如@Rory McCrossan指出的那样，您必须改进html button：

＆＃13;

$(document).on('click', ".remove", function(e) {
    console.log($(this).index());
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<button class="remove" value="1">Button 1</button>
<button class="remove" value="2">Button 2</button>
<button class="remove" value="3">Button 3</button>

＆＃13;

如何通过单击的类获取元素的索引

2 个答案: