Example of php implementing website thumbing function

Many websites support the like and dislike functions to display user feedback on the content of the current web page. This article mainly introduces relevant information about the complete front-end code of PHP to implement the website upvoting function. I hope to be helpful.

Below we give the complete front-end implementation code of the like and dislike functions used by this site for user reference.

The complete front-end code includes codes for html, css, and js parts. Use the following front-end code, plus the back-end code that you can simply implement by yourself, to achieve a complete upvote function.

Front-end html code:

<p id="vote" data_id="文章唯一key">
  <span id="dig" class="vote-btn"><span class="vote-num">顶的次数</span></span>
  <span id="bury" class="vote-btn"><span class="vote-num">踩的次数</span></span>
</p>

Front-end css code:

#vote {
  /* margin: 0 auto; */
  text-align: center;
}

.vote-btn {
  margin: 0 20px;
  display: inline-block;
  width: 60px;
  height: 54px;
  cursor: pointer;
}

#dig {
  background: url("http://www.php.cn/static/image/dig.gif");
}

#bury {
  background: url("http://www.php.cn/static/image/bury.gif");
}

.vote-num {
  display: inline-block;
  font-size: 14px;
  margin-top: 32px;
  color: white;
}

Front-end js code, The code here is based on jQuery:

$("#vote .vote-btn").bind("click", function(){
    var me = $(this);
    var id = me.parent().attr("data_id");
    var type = this.id;
    $.post("请求地址", {'type': type, 'id': id }, function(data){
      data = $.trim(data);
      if(data == 'success'){   //如果投票成功
        $num = me.find(".vote-num");
        $num.html( parseInt($num.html()) + 1 ); //投票+1
        //取消绑定的点击事件，并还原鼠标指针样式
        $("#vote .vote-btn").unbind("click").css("cursor", "auto");
        if(type == 'bury'){
          alert("您投了反对票，敬请在评论中留言告知您的意见，以便于我们改正!");          
        }
      }else if(data == 'done'){  //如果已经投票过
        //取消绑定的点击事件，并还原鼠标指针样式
        $("#vote .vote-btn").unbind("click").css("cursor", "auto");
        alert("您已经投票过，无法再次投票!");
      }else{   //投票失败
        alert("由于系统或网络问题，投票没有成功，建议您稍后重新投票!");        
      }
    });
  });

You can change the js code yourself according to the needs of the background.

The rough implementation of the background code is: first determine whether the user has voted based on cookie or database data. If the user has voted before, done is returned; if the voting operation is successful, success is returned; if the vote fails Returns error or other error information.

Related recommendations:

Example of PHP using ODBC to connect to the database

php example of converting ubb code

php fun test program example

The above is the detailed content of Example of php implementing website thumbing function. For more information, please follow other related articles on the PHP Chinese website!