PHP+ajax实现不刷新当前页面修改数据

//index.php页面
<div>
  <div>
    <a href="javascript:;" data-id="$rs["id"]?>" data-num="$rs["hits"]?>" class="huo_add" style="background-color:#FF0000; width:100px; height:20px;">增加</a></div>
    //在这个a标签中获取,当前信息的 id(data-id) 以及数据(data-num)
  <div class="zan_zong$rs["id"]?>">$rs["hits"]?><div>
  //为什么要在zan_zong类后面当前数据的ID?防止冒泡,简单来说就是防止点击一个其它的也变化
</div>
//ajax_index.js页面
$(function(){	
	$(document).on('click', '.huo_add', function() {//给huo_add绑定点击事件
		var dang_Id = $(this).attr("data-id");//获取信息id
		var Z_zong = $(this).attr("data-num");//获取数据
		console.log('当前数据');
		console.log(Z_zong);
		console.log('当前ID');
		console.log(dang_Id);
		$.ajax({
			url : "ajax_index.php?dang_Id="+dang_Id,//提交给ajax_index.php页面,后面跟随当前信息ID
			data : {
				act : "huo_add"
				}, //参数Json格式
			dataType : "html", //请求的返回类型
			type : "post",  //提交方式
			cache : false,  //是否异步提交true
			success : function(v){
				//layer.closeAll();
				//利用反馈成功判断
					if(v=="100"){
						var numZ_zong = parseInt(Z_zong)+1;//获得变化后的数据和数据库一致
						var lei = "zan_zong"+dang_Id;//申明不同信息的类
						$("."+lei).text(numZ_zong);//赋值给类的文本
						//如果说想要无限点击,在这里在把numZ_zong的值,赋值给HTML页面data-num即可,
						$(".huo_add").attr("data-num=",numZ_zong);//100
					}
			}
		});									 
	 });
});	
//ajax_index.php页面

include 'adminIsAdmin/php_conn.php';//引用数据库链接
$DpinglunId =  $_GET['dang_Id'];//获取当前信息id
if($_POST["act"]=="huo_add"){	
	$sqlp="select * from php_news where id='".$DpinglunId."'";//查询当前id的信息
	$resultp = mysqli_query($conn,$sqlp);
	$nump = mysqli_num_rows($resultp);
	$rsp = mysqli_fetch_array($resultp);
	if($nump){	
		//更新预数据
		//当前id的信息的数据+1
		$P_Gou = $rsp["hits"] + 1;
		$sql="update php_news set hits='{$P_Gou}' where id='".$DpinglunId."'";
		$result = mysqli_query($conn,$sql);
		//修改成功
		echo '100';
		//ajax_index.js
	}
	exit;
}
?>

你可能感兴趣的:(Ajax)