How to combine php with ajax to realize the collection function without refreshing, which is gray before clicking on an icon and red after clicking. It is best to have an example~Thank you guys~
代言2017-07-05 10:04:03
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<script src="https://cdn.bootcss.com/jquery/3.2.1/jquery.js"></script>
</head>
<style>
.color{
color: #CCC;
}
</style>
<body>
<p class="color">灰色</p>
</body>
<script>
$(function () {
var $p = $(".color");
$p.click(function () {
$.ajax({
url:"xxxx",
data:"xxxx",
success:success
});
function success() {
$p.css("color","#F00");
}
})
})
</script>
</html>
After the PHP processing is completed, it will be processed in the callback function.
滿天的星座2017-07-05 10:04:03
<html>
<p id="goods_id_1">产品1号</p>
<a href="javacript:collection(1)">收藏</a>
</html>
<script>
function collection(gid)
{
$.ajax(
url:"处理页面.***",
data:{goods_id:gid},
Type:"POST",//PHP举例,这里用POST,处理页面里收到的参数字段为$_POST['goods_id'],gid为你想要收藏的参数值
dataType: "json",//还有text,html等,参考[ajax方法]
success: function(data){alert('收藏成功');}//成功后,data为url里填写的处理页面的返回参数
);
}
</script>
You can go and see the detailed introduction of ajax method [ajax method]
学习ing2017-07-05 10:04:03
Send an ajax request after clicking, and then set the icon color to red. At the same time, you need to pay attention to every time you request this page, remember to initialize the color of this collection icon.
淡淡烟草味2017-07-05 10:04:03
Click to collect
<script>
//$id is the product id to be collected
//url is the address of the operation data
function collection($id){
if($id==''){return false; }
var param={};
param.id=$id;
$.post('url',param,function(data){
if(data==true){
alert('Collection successful');
}else{
alert('Please try again later');
}
})
}
</script>
///Data operation
public function like(){
1 post receiving data
2 Recent Row deposit operation
3 Return value (return true if successful, false if failed)
}