说明:平时我们喜欢购物,但有时也有一些人手机卡频繁点击加入购物车,造成请求服务器频繁操作,在用户基数大的时候,会给服务器造成不少的资源浪费,所以给出下面简单demo供大家参考。在第一次点击后,如果再接连点击会弹出操作频繁,本案例设置下次点击间隔在1.5s。
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>购物车(时间间隔)(解决点击过于频繁时问题)</title>
<script src="https://cdn.bootcss.com/jquery/1.10.2/jquery.min.js">
</script>
</head>
<body>
<p ctime="null" class="clickTime">点我</p>
</body>
</html>
<script type="text/javascript">
$(document).ready(function(){
//购物车(时间间隔)(解决点击过于频繁时问题)
$(".clickTime").click(function(){
var clickTime= $(this).attr("ctime");
var nowTime = new Date().getTime();
if (clickTime != 'undefined' && (nowTime - clickTime < 1500)) {
alert("操作过于频繁");
} else {
$(this).attr({"ctime":nowTime});
$(this).html("每隔1.5秒点我不会出现弹框+时间戳:"+nowTime);
}
});
});
</script>
网友评论