Wordpress实现文章支持和反对的功能 - WordPress

Wordpress实现文章支持和反对的功能

如果你上网易或QQ网站都会看到文章页面有很多种支持和反对的功能,我们可以发表自己的意见,那么要如何实现文章支持和反对的功能,下面我来介绍利用ajax快速实现.

我是用wp做二次开发的,当然你也可以装插件,不过我是自己定制的了,实现代码：

首先在数据库表wp_posts添加两个字段like 和un like

PHP实例代码如下:

public   function  dolike_unlike(){            $b  = M();            $input  =  new  input();            $id  =  $input ->post( 'id' ); //过滤提交的信息。防止sql注入，之前发的代码我都补上了。             //$id = 5524;             $val  =  $_POST [ 'data' ];            if ( $val ==1){            $b ->query( "update `wp_posts` set `like` =`like`+1 WHERE id = $id" ); //点击like的更新                   } else   if ( $val ==0){                $b ->query( "update `wp_posts` set `unlike` =`unlike`+1 WHERE id = $id" );   //dislike更新                    } else {                        $this ->error( 'error' );                       }            $list  =  $b ->query( "SELECT `like`,`unlike` FROM `wp_posts` WHERE id = $id" ); //获取数据             $like  =  $list [0][ 'like' ];            $dislike  =  $list [0][ 'unlike' ];            if ( $like !=0 ||  $dislike !=0){ //计算                 $elike  =  $like /( $like + $dislike );                $elike  =  substr ( $elike *100,0,4);                $edislike  =  $dislike /( $like + $dislike );                $edislike  =  substr ( $edislike *100,0,4);               }            //echo $elike;             $output  =  array ( //组合函数待输出                likenum=> $like ,               dislikenum=> $dislike ,               like=> $elike ,               dislike=> $edislike           );            //echo $list;             //dump($output);             $this ->ajaxReturn( $output , 'success' ,1); //输出             //echo 'ok';             //$this->display('');            }  

html实例代码如下:

< div   class = "cl" > </ div >                         < style >                      .recomm{ border-bottom:4px solid #FF7523; color:#FF7523}                     .single_share_class{ position:absolute; left:-95px; top:80px; width:75px; height:328px; text-align:center; background:url(/img/single_page_share.png) no-repeat;}                     .single_share_class 测试数据m_num{ padding:12px 0 48px 0px}                     .single_share_class 测试数据m_num span{ font-size:10px; line-height:11px; color:#ff9853; display:block}                     .single_share_class  > span  > span  > span{ margin-bottom:7px !important;}                     .single_share_class .copylink{ padding:28px 0 0 0; cursor:pointer}                     .single_share_class .st_sharethis_large  > span  > span{ background:none !important}                     .dingandcai{ width:526px; height:62px; background:url(/img/likeandunlike.jpg) no-repeat; margin:20px 0;line-height:62px; text-align:center; font-size:24px; text-shadow:1px 1px 1px #000; }                     .dingandcai .left_like{ width:224px; float:left;height:62px; position:relative}                     .dingandcai .left_like span,.dingandcai .right_unlike span{ position:relative; z-index:2}                     .dingandcai .dingload{ width:78px; float:left; }                     .dingandcai .right_unlike{ width:224px; float:left; height:62px;position:relative }                     .dingandcai .left_like .left_con{ background:url(/img/likeandunlike.jpg) 0px -63px no-repeat; width:50%; height:62px;position:absolute;top:0;left:0; z-index:1}                     .dingandcai .right_unlike .right_con{ background:url(/img/likeandunlike.jpg) -302px -63px no-repeat; width:50%; height:62px;position:absolute;top:0;left:0; z-index:1}                     .allow_click,.disallow_click{cursor:pointer}                      </ style >                        < div   class = "dingandcai" >                       < div   class = "left_like"    val = "1"   postid = "<?php the_ID(); ?>" >                       < div   class = "left_con" > </ div > < span   id = "like" > Like </ span >                                          </ div >                       < div   class = "dingload" >                       < img   src = "/img/loading_sm.gif"   /> &nbsp;                      </ div >                       < div   class = "right_unlike"    val = "0"   postid = "<?php the_ID(); ?>" >                       < div   class = "right_con" > </ div >                       < span   id = "dislike" > Dislike </ span >                       </ div >                       </ div >                       < div   class = "cl" > </ div >  

js实例代码如下:

jQuery( ".dingload img" ).ajaxStart( function (){ //ajax提示            jQuery( this ).show();           });       jQuery( ".dingload img" ).ajaxStop( function (){           jQuery( this ).hide();           });         var  pid = jQuery( ".left_like" ).attr( "postid" );          var  likecookie = jQuery.cookie( "like" +pid);        if (likecookie!=pid){ //判断是否点击过，如果没有点击则                jQuery( ".left_like,.right_unlike" ).addClass( "allow_click" );               jQuery.get( '/cityosweb/default.php/Shanmao/wplike_unlike' ,{id:pid}, function (data){                        if (data.status==1){ //显示背景百分比和like dislike字样                            jQuery( ".left_like .left_con" ).css( "width" ,data.data.like+ "%" );                           jQuery( ".right_unlike .right_con" ).css( "width" ,data.data.dislike+ "%" );                           }                       }, "json" );               } else { //如果已经投过票了则                           jQuery( ".left_like,.right_unlike" ).addClass( "disallow_click" );                         jQuery.get( '/cityosweb/default.php/Shanmao/wplike_unlike' ,{id:pid}, function (data){                        if (data.status==1){ //显示背景百分比和投票数                             //alert(data.likenum);                            jQuery( "#like" ).html(data.data.likenum);                           jQuery( "#dislike" ).html(data.data.dislikenum);                           jQuery( ".left_like .left_con" ).css( "width" ,data.data.like+ "%" );                           jQuery( ".right_unlike .right_con" ).css( "width" ,data.data.dislike+ "%" );                           }                       }, "json" );                   }       jQuery( ".left_like,.right_unlike" ).click( function (){            if (jQuery( this ).hasClass( "allow_click" )){ //如果有这个class才提交                 var  val = jQuery( this ).attr( "val" );                var  postid = jQuery( this ).attr( "postid" );               jQuery.post( '/cityosweb/default.php/Shanmao/dolike_unlike' ,{data:val,id:postid}, function (data){ //点击的时候                 if (data.status==1){ //成功返回处理                            jQuery( "#like" ).html(data.data.likenum);                           jQuery( "#dislike" ).html(data.data.dislikenum);                           jQuery( ".left_like .left_con" ).css( "width" ,data.data.like+ "%" );                           jQuery( ".right_unlike .right_con" ).css( "width" ,data.data.dislike+ "%" );               jQuery( ".left_like,.right_unlike" ).removeClass( "allow_click" ).addClass( "disallow_click" );              jQuery.cookie( 'like' +postid,postid,{expires: 1}); //提交后写入cookie，这里是用juqery.cookie插件。保存一天时间，每篇文章保存不一样的id。值随意，只要你上面好做判断。                } else {                   alert(data.info);                   }                   }, "json" );           }           });       jQuery( ".disallow_click" ).live( "click" , function (){ //不允许提交时候弹出            alert( "Your vote has already been submitted!" );           }); 

查看更多关于Wordpress实现文章支持和反对的功能 - WordPress的详细内容...