防止按鈕在短期內被屢次點擊屢次觸發事件

如何防止在短期內屢次點擊按鈕屢次觸發事件呢?javascript

個人解決方法是:設置一個延時器,就能夠起到做用了。css

下面附上代碼,方便往後回看。html

<!DOCTYPE html>

<html>

<head>

<meta charset="UTF-8">

<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />

<title>阻止屢次點擊出發屢次事件</title>

<style type="text/css">

.btn{

background-color: #3377FF;

line-height: 50px;

color: #FFFFFF;

text-align: center;

margin: 100px auto;

}

</style>

</head>

<body>

<div class="btn">確認</div>

</body>

<script src="js/jquery-3.2.1.js"></script>

<script type="text/javascript">

var timer = null;

$('.btn').click(function(e){

if(timer != null){

clearTimeout(timer);

}

timer = setTimeout(function(){

touchBtn();

},1000);

})

function touchBtn(){

console.log('這是一個向服務器請求的方法');

}

</script>

</html>
相關文章
相關標籤/搜索