JS控制按钮防止多次点击

本文介绍了一种通过JavaScript实现的防止按钮被短时间内重复点击的方法。该方法利用全局变量标识符来判断按钮是否已被点击,并通过setTimeout函数设定在一定时间后重置按钮状态,确保用户体验的同时避免了因误操作导致的问题。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >


<!DOCTYPE html>
<html>
<head>
    <title></title>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <script type="text/javascript">
        // 按钮防止短时间多次点击
        //全局变量标识
        var CLICKTAG = 0;

        function button_onclick(pElement){
            if (CLICKTAG == 0) {  
                CLICKTAG = 1;  
                pElement.disabled=true;
                // 等待3s后重置按钮可用
                setTimeout(function () { CLICKTAG = 0 ; pElement.disabled=false;}, 3000);  
            }
        }
    </script>
</head>

<body>
    <input type="button"  style="width:125px;height:25px;" value = "点击" onclick="button_onclick(this)" ></button>
</body>
</html>


评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值