美文网首页js
js解决点击购物车过于频繁的问题

js解决点击购物车过于频繁的问题

作者: world_7735 | 来源:发表于2018-07-23 18:07 被阅读70次

说明:平时我们喜欢购物,但有时也有一些人手机卡频繁点击加入购物车,造成请求服务器频繁操作,在用户基数大的时候,会给服务器造成不少的资源浪费,所以给出下面简单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>

相关文章

网友评论

    本文标题:js解决点击购物车过于频繁的问题

    本文链接:https://www.haomeiwen.com/subject/edgjmftx.html