Jquery为所有以前的兄弟姐妹添加了类

时间:2014-07-23 19:46:16

标签: javascript jquery

我正在使用WordPress中的简单评级系统。

<div id="r1" class="rate_widget"
                             data-post-id="<?php echo $post_id ?>"
                             data-user-id="<?php echo $user_id;  ?>"
                             data-nonce="<?php echo $nonce ?>"
                            >
                            <div data-rating="1" class="ratings_stars"></div>
                            <div data-rating="2" class="ratings_stars"></div>
                            <div data-rating="3" class="ratings_stars"></div>
                            <div data-rating="4" class="ratings_stars"></div>
                            <div data-rating="5" class="ratings_stars"></div>
                            <div class="total_votes">vote data</div>
                        </div>

我有三个班级

1-rating_stars = simply to show star.png
2- ratings_vote = when user hover over stars it turns into yellow
3- ratings_done = After receiving a response star turn into blue.

我想根据Ajax收到的数字添加或删除类。

以下是代码:

$('.ratings_stars').hover(

function() {
    $(this).prevAll().andSelf().addClass('ratings_over');
    $(this).nextAll().removeClass('ratings_vote');
    },

function() {
    $(this).prevAll().andSelf().removeClass('ratings_over');

    }
);


// This actually records the vote
$('.ratings_stars').bind('click', function() {
    var star = this;
    var widget = $(this).parent();


    var clicked_data = {
    clicked_on : $(star).attr('data-rating'),
    widget_id : $(star).parent().attr('id'),
    post_id:$(star).parent().attr('data-post-id') ,
    user_id:$(star).parent().attr('data-user-id') ,
    nonce: $(star).parent().attr('data-nonce'),
    action: 'rating_system'
    };

    console.log(clicked_data);
    $.ajax({
        type: 'POST',
        data: clicked_data,
        url : myAjax.ajaxurl,
        success: function(INFO) {

            $("div[data-rating = '" + INFO + "']").prevAll().addBack().addClass('ratings_vote');
            $('.rate_widget').find('[data-rating="' + INFO + '"]').prevAll().andSelf().addClass('ratings_vote');
            $('.rate_widget').find('[data-rating="' + INFO + '"]').nextAll().removeClass('ratings_vote');
        }
    });
});

我已尝试过这些最后一行,但它不起作用。但我在控制台中运行相同的代码,它完美无缺。 INFO是1到5之间的数字。

  $("div[data-rating = '" + INFO + "']").prevAll().addBack().addClass('ratings_vote');
     $('.rate_widget').find('[data-rating="' + INFO + '"]').prevAll().andSelf().addClass('ratings_vote');

有什么方法可以解决吗?

0 个答案:

没有答案