Question

HTML：

<div class="vote" id="<?php echo $id; ?>">

jQuery的：

$('.vote').on('click', function() {
    var div = $(".vote").attr('id');
    $.ajax({
        type: "POST",
        url: "vote.php",
        data: {
            id: $(".vote").attr('id')
        },
        success: function(data) {
            alert(div);
        }
    });
});

这有用，但是 div var它始终是第一个元素 - 并且运行两次（两个带有vote类的div）。

我也使用AJAX来显示结果（带有vote类的div）。

为什么会发生这种情况，我该如何解决？

Answer 1

您需要使用this，它指的是调用该元素的元素。

var div = $(this).attr('id'); //this.id;

当您使用$(".vote").attr('id')时，它将始终返回您第一个元素的ID。

当您使用id存储自定义数据时。我建议您使用data-*前缀自定义属性，可以使用.data()

获取

<div class="vote" data-id="<?php echo $id; ?>">

然后你可以使用

 var id = $(this).data('id');

Answer 2

您需要使用当前元素点击上下文this：

var div = this.id;

Answer 3

使用this.id代替$('.vote').attr('id')，因为如果您使用$('.vote').attr('id')

，javascript将获得他找到的第一个ID

Answer 4

将$（＆＃39; .vote＆＃39;）替换为$（this），如下所示：

$('.vote').on('click', function() {
    var div = $(this).attr('id');
    $.ajax({
        type: "POST",
        url: "vote.php",
        data: {
            id: $(this).attr('id')
        },
        success: function(data) {
            alert(div);
        }
    });
});

jQuery每次都选择第一个元素

4 个答案: