一瞬儿光
<img src="###" class="img">//引入jquery.js
//引入jquery.cookie.js
//点击数存进本地缓存
$(".img").click(function () {
var img_click_num = $.cookie("img_click_num") || 0;
$.cookie("img_click_num",Number(img_click_num)+1,{expires:30});
})
//ajax提交点击数
var setImgClickNum = function(num) {
$.ajax({
url : setImgClickNum.php,
type : 'POST',
data : {num : num},
dataType : 'JSON',
success : function(msg) {
if(msg.status == 1) {
var img_click_num = $.cookie("img_click_num");
$.cookie("img_click_num",img_click_num - num ,{expires:30});
}
}
})
}
//定时提交
//一分钟检查一次
setInterval(function(){
var img_click_num = $.cookie("img_click_num") || 0;
img_click_num > 0 && setImgClickNum();
},1000*60)//原生写法
//PHP接口
//setImgClickNum.php
$num = $_POST['num'];
!is_int($num) && exit(json_encode(array('status'=>-1,'info'=>'参数不正确')));
$sql = "insert into tableName (`clicknums`) values ($num)";
$res = mysql_query($sql,$dbname);
$res ? exit(json_encode(array('status'=>1,'info'=>'提交成功'))) :
exit(json_encode(array('status'=>0,'info'=>'提交失败')));//代码就这么多,专门给你写的,你有礼貌,我就愿意闲着给你写下,你谢谢都没有,再闲一个字都不想给你动。//这地方用了异步定时每分钟提交方式,优点在于不用每点击一次就提交一次,增大服务器压力,当然你可以把定时器时间设更长点。//js使用了本地缓存到cookie,没有使用全局变量,优点在于防止全局污染,其次防止多次点击后,立即刷新页面或者关闭跳转页面导致来不及提交。//js部分的这一句$.cookie("img_click_num",img_click_num - num ,{expires:30});很关键,为什么不重新置为0,可以想一想,肯定是为了防止用户恰好在异步提交的时候又有点击动作,那么在提交成功后,就会清除这一部分的数据,保证数据同步性。//接口没使用框架,原生的一个思路,具体根据你的业务要求去实现就可以了。如果跨域就使用jsonp。当然服务器端也可以先用缓存,最后定时异步写入数据库是最好,如果数据量不大,直接写库也无所谓了。