前端防止按鈕被多次點選
阿新 • • 發佈:2019-01-03
前端的部分邏輯有時候控制前端的顯示,比如記錄收藏數目等等。有時候多次重複點選會造成前端顯示的bug。所以需要有部分邏輯判斷去篩除掉重複多次的點選。
實現部分程式碼如下,主要是通過setTimeout去加以判斷,即無論點選幾次,間隔一定時間才會去觸發一次事件,從而只產生一次的記錄:
<script> var i=0; //判斷點選次數寄存 var closetimer = null; //延時函式寄存 function Button1_Click() //botton點選事件 { console.log('1'); i++; //記錄點選次數 closetimer = window.setTimeout(setout,200); } function setout(){ //點選執行事件 if(i>1) //如果點選次數超過1 { console.log('wrong'); window.clearTimeout(closetimer); //清除延時函式 closetimer = null; //設定延時寄存為null //新增操作程式碼 i=0; //重置點選次數為0 } else{ //如果點選次數為1 console.log('right'); i=0; //重置點選次數為0 //新增執行操作的程式碼 } } </script>