js怎么防止重复点击

JavaScript018

js怎么防止重复点击,第1张

1.防止重复点击可以添加标记,第一次点击后变为false,每次点击判断这个标记是true才执行

2.如果是按钮防止重复点击,可以再按钮点击后,给按钮添加disabled属性,按钮就再也点击不了

举个例子:

<!doctype html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>Document</title>

</head>

<button onclick="fn()">方式一</button>

<button onclick="alert('只会出现一次哦,之后想点都点不了')this.disabled = true">方式二</button>

<body>

<script>

    //第一种方式

    var flag = true

    function fn(){

        if(flag){

            flag = false

            alert('只会出现一次哦')

        }

    }

</script>

</body>

</html>

前几天遇到了一个关于前端重复点击事件问题,防止用户恶意操作,重复点击按钮事件,有二个逻辑解决此问题:

1.

2.定义变量保存每次点击的时间,上次和当前次点击的时间间隔小于某个时间,就return掉,否则就继续之后步骤,类似于

this.state={clickTime:new Date().getTime()}

  buyCard(){ 

   var {clickTime} =this.state

    var nowTime = new Date().getTime()

     if( clickTime != 'undefined'&& (nowTime - clickTime <500)){

               return false

     }else{

        this.setSate({clickTime:nowTime})

        .....

     }       

}