Question

我正致力于使用AJAX和PHP为我的网站创建喜欢/不喜欢的功能。以下是我的js代码：

jQuery(document).ready(function($){
$('.ups .fa').live('click', function(){
    $this = $(this);
    $.ajax({
        type : "post",
        dataType : "json",
        url : loggmax_ratings.ajaxurl,
        data : { 
            action: "loggmax_ratings_like_post", 
            dislike_num : $this.closest('.pointer').find('.downs').attr('data-dislike_num'),
            like_num : $this.parent().attr('data-like_num'), 
            user_id : loggmax_ratings.user_id, 
            post_id : loggmax_ratings.post_id, 
            ip : loggmax_ratings.ip
        },
        success: function(response) {
            console.log(response);
            $this.parent().attr('data-like_num', response['like_num']);
            $this.parent().find('em').text(response['like_num']);
            if(response['dislike_num'] != $this.closest('.pointer').find('.downs').attr('data-dislike_num')) {
                if($this.closest('.pointer').find('.downs').find('.pull-left').hasClass('active')) {
                    $this.closest('.pointer').find('.downs').find('.pull-left').removeClass('active');
                }else{
                    $this.closest('.pointer').find('.downs').find('.pull-left').addClass('active');
                }
            }
            $this.closest('.pointer').find('.downs').attr('data-dislike_num', response['dislike_num']);
            $this.closest('.pointer').find('.downs').find('em').text(response['dislike_num']);
            if($this.hasClass('active')) {
                $this.removeClass('active');
            }else{
                $this.addClass('active');
            }
        }
    });
});

$('.downs .fa').live('click', function(){
    $this = $(this);
    $.ajax({
        type : "post",
        dataType : "json",
        url : loggmax_ratings.ajaxurl,
        data : { 
            action: "loggmax_ratings_dislike_post", 
            like_num : $this.closest('.pointer').find('.ups').attr('data-like_num'),
            dislike_num : $this.parent().attr('data-dislike_num'), 
            user_id : loggmax_ratings.user_id, 
            post_id : loggmax_ratings.post_id, 
            ip : loggmax_ratings.ip
        },
        success: function(response) {
            $this.parent().attr('data-dislike_num', response['dislike_num']);
            $this.parent().find('em').text(response['dislike_num']);
            if(response['like_num'] != $this.closest('.pointer').find('.ups').attr('data-like_num')) {
                if($this.closest('.pointer').find('.ups').find('.pull-left').hasClass('active')) {
                    $this.closest('.pointer').find('.ups').find('.pull-left').removeClass('active');
                }else{
                    $this.closest('.pointer').find('.ups').find('.pull-left').addClass('active');
                }
            }
            $this.closest('.pointer').find('.ups').attr('data-like_num', response['like_num']);
            $this.closest('.pointer').find('.ups').find('em').text(response['like_num']);
            if($this.hasClass('active')) {
                $this.removeClass('active');
            }else{
                $this.addClass('active');
            }
        }
    });
});
});

这是我的标记：

<div class='rating-buttons-block artticle-rating-buttons-block pull-left' itemprop='aggregateRating' itemscope itemtype='http://schema.org/AggregateRating'>
   <span class='pointer rating-button ups pull-left' data-like_num='0'><i class='fa fa-thumbs-up'></i><em class='upsNumber'>0</em></span>
   <span class='pointer rating-button downs pull-left' data-like_num='0'><i class='fa fa-thumbs-down'></i><em class='downsNumber'>0</em></span>
</div>

到目前为止，当我点击Like图标时，数字变为-1，当我再次点击时，它变为-2，依此类推。不喜欢的图标根本不起作用。我想要实现的是在单击时增加喜欢和不喜欢的内容，并在单击任何图标时在active属性中添加类span。

我对Javascript / jQuery完全陌生。对此的任何想法将不胜感激。

喜欢/不喜欢使用AJAX的功能

0 个答案: