攒,顶,踩功能主要用于评论中这里我们来做一个简单基于jquery ajax与php的mysql实现的攒,顶,踩功能。

php应用越来越多，也越来越广泛，为了增加网站的丰富多彩，从而出现了很多新的技术。ajax是现代网站中不能缺少的一项技术，他可以异步刷新数据，而实现很多效果，比如刷新验证码，微博中的攒功能，都是运用这个。

主页文件index.php,代码如下:

1. <script type="text/javascript" src="/Public/js/jquery.min.js"></script> 
2. <script type="text/javascript" src="finger_ajax.js"></script> 
3. <?php 
4.  header("Content-type:text/html;charset=utf-8"); 
5.  include "finger_ajax.php"; 
6.  $sql = "select * from finger_ajax"; 
7.  $res = mysql_query($sql,$link); 
8.  while($row = mysql_fetch_array($res)){ 
9.   echo "<p>".$row['title']." <a href='#' onclick='finger(".$row['id'].")'><img src='finger.jpg'/>攒一下(<span class='finger".$row['id']."'>".$row['finger']."</span>)</a></p> "; 
10.  } 
11. ?> 

处理ajax请求及配置信息文件finger_ajax.php,代码如下:

1. <?php 
2.  /**"攒" 功能 响应ajax请求*/ 
3.  //配置 
4.  $dbHost = "localhost"; 
5.  $dbUser = "root"; 
6.  $dbPass = "dddddd"; 
7.  $dbName = "test"; 
8.  $dbCharset = "utf8"; 
9.  
10.  
11.  $link = mysql_connect($dbHost,$dbUser,$dbPass) or die(mysql_error()); 
12.  mysql_query("set names ".$dbCharset); 
13.  mysql_select_db($dbName); 
14.  // End 
15.  //接受对应的id 
16.  if(!emptyempty($_POST['id'])){ 
17.   $id = $_POST['id']; 
18.   //“攒”加1 
19.   $sql = "update finger_ajax set finger=finger+1 where id=$id;"; 
20.   if(mysql_query($sql,$link)){ 
21.    echo "ok"; 
22.   }else{ 
23.    echo "failed"; 
24.   } 
25.  } 
26. ?> 

js文件finger_ajax.js代码如下：

1. //攒 js 
2. function finger(topic_id){ 
3.  $.post("finger_ajax.php", { "id": topic_id }, 
4.    function(data){ 
5.      if(data=="ok"){ 
6.    alert("感谢您的支持！"); 
7.   }else{ 
8.    alert("对不起，失败了！"); 
9.   } 
10.    }, "text");  
11.  //获取当前“攒”的次数并加1 
12.  var finger = parseInt($(".finger"+topic_id).html())+1; 
13.  //更新“攒”的次数 
14.  $(".finger"+topic_id).html(finger); 
15. } 

数据库代码finger_ajax.sql代码如下:

1. DROP TABLE IF EXISTS `finger_ajax`; 
2. CREATE TABLE `finger_ajax` ( 
3.   `id` int(11) NOT NULL AUTO_INCREMENT, 
4.   `title` varchar(50) NOT NULL DEFAULT '', 
5.   `finger` int(11) NOT NULL DEFAULT '0', 
6.   PRIMARY KEY (`id`) 
7. ) ENGINE=MyISAM AUTO_INCREMENT=3 DEFAULT CHARSET=utf8; 
8.  
9.  
10. -- ---------------------------- 
11. -- Records of finger_ajax 
12. -- ---------------------------- 
13. INSERT INTO `finger_ajax` VALUES ('1', '今天天气还不错哦！去做点什么好呢？', '10'); 
14. INSERT INTO `finger_ajax` VALUES ('2', '欢迎来到 www.111cn.net，国庆将至，祝大家国庆节快乐！！', '3');