js限制用户频繁点击提交处理方法

如果页面上面有一个“提交”按钮，这个点击后会触发比较复杂的业务逻辑或者直接处理DB中的数据，这个时候我们通常不希望用户频繁点击提交或恶意点击，这就需要我们对这个有个时间限制了，比如5s后才能发表评论等等。

 

通过js我们可以比较轻松的实现这个需求：

 

<script type="text/javascript">
     // 存储变量信息
     var VAR ={
        repeatTemp:[]
    }

     var COM = {
        repeat: function(s,t){ // 限制执行频率，默认为60秒 允许执行时返回false
            t = t ? t * 1000 : 60000; // 毫秒
             var time = microtime();
                 if(!VAR.repeatTemp[s]){
                    VAR.repeatTemp[s] = time;
                     return  false; // 允许
                } else{
                     var ts = t - (time - VAR.repeatTemp[s]);
                    ts = parseInt(ts/1000);
                 if(ts > 0){
                    alert("频率限制：还有 <b>"+ ts +"</b> 秒才可以再执行！");
                     return  true; // 禁止执行
                } else{

                    VAR.repeatTemp[s] = time; // 更新时间
                     return  false; // 允许
                }
            }
        }
    }


     // 刷新
     function ref(){
         var btn = COM.repeat('btn');
         if(!btn){alert("可以执行了！");} else{ return;}
    }


     // 获取毫秒级时间戳
     function microtime(){

         return  new Date().getTime();
    }  

  </script>

 

 

js的实现逻辑就这样几句code，然后我们可以在页面中弄一个测试button

 

<input type="button" id="btn" οnclick="ref();" value="提交"/>

 

 

 如果频繁的去点击则会触发警告消息框。

 

 

 

 

 

 

 

 

 

转载于:https://www.cnblogs.com/zzxbest/archive/2011/11/24/2261401.html