php - 如何识别点击的div。查询

Question

我有用 jQuery 和 PHP 编写的脚本。这是一个小投票系统。当我将鼠标放在一个 div 上时，当我有我的指针时，它会显示一个黄色的星星指向。例如:http://prntscr.com/7pm8u6 .这并不像我想要的那样直观，因为黄色星星出现在我页面上的每个帖子上。您可以在屏幕截图上看到它。我怎样才能使每篇文章的 div 都是唯一的？

$(function(){ 

    $('.rate-btn').hover(function(){

        $('.rate-btn').removeClass('rate-btn-hover');
        var therate = $(this).attr('id');
        for (var i = therate; i >= 0; i--) {
            $('.rate-btn-'+i).addClass('rate-btn-hover');
        };
    });

    $('.rate-btn').click(function(){    
        var therate = $(this).attr('id');
        var theid = $(this).attr('name');
        var dataRate = 'act=rate&post_id='+theid+'&rate='+therate; //
        $('.rate-btn').removeClass('rate-btn-active');
        for (var i = therate; i >= 0; i--) {
            $('.rate-btn-'+i).addClass('rate-btn-active');
        };
        $.ajax({
            type : "POST",
            url : "http://localhost/rating/ajax.php",
            data: dataRate,
            success:function(){}
        });

    });
});

这是我的 div:

echo '<div id="1" alt="';$post_id=$query2['id'];echo $post_id; echo '" class="rate-btn-1 rate-btn" name="';$post_id=$query2['id'];echo $post_id; echo '"></div>';
echo '<div id="2" alt="';$post_id=$query2['id'];echo $post_id; echo '" class="rate-btn-2 rate-btn" name="';$post_id=$query2['id'];echo $post_id; echo '"></div>';
echo '<div id="3" alt="';$post_id=$query2['id'];echo $post_id; echo '" class="rate-btn-3 rate-btn" name="';$post_id=$query2['id'];echo $post_id; echo '"></div>';
echo '<div id="4" alt="';$post_id=$query2['id'];echo $post_id; echo '" class="rate-btn-4 rate-btn" name="';$post_id=$query2['id'];echo $post_id; echo '"></div>';
echo '<div id="5" alt="';$post_id=$query2['id'];echo $post_id; echo '" class="rate-btn-5 rate-btn" name="';$post_id=$query2['id'];echo $post_id; echo '"></div>';

Answer 1

如果我没看错您的 PHP，您已经在其名称属性中获得了关于明星与哪个帖子相关的信息。因此，您需要做的就是检索该信息，然后只选择以正确的名称开头:

$('.rate-btn').hover(function(){

    $('.rate-btn').removeClass('rate-btn-hover');
    var postid = $(this).attr('name'); //Get the post id from the name.
    var therate = $(this).attr('id');
    for (var i = therate; i >= 0; i--) {
        //Only add the class to the stars with the right name.
        $('.rate-btn-'+i+'[name='+postid+']').addClass('rate-btn-hover');
    };
});

在您的代码中，您为多颗星赋予了相同的 ID。这是不好的做法，因为 ID:s 应该是唯一的。考虑将该信息迁移到自定义属性中，例如 data-star-number 或类似的东西。