function counter2(){
var counter =10;
var on=document.getElementById("bet");
setInterval(function(){
counter--;
if(counter==9){
on.innerHTML = "";
}
if(counter>=0){
id=document.getElementById("res");
var bet=document.getElementById("pts");
var beth=document.getElementById("beth");
var betv=document.getElementById("betv");
id.innerHTML="Bet within " +counter + " seconds";;
beth.disabled = false; //Beth is both Function and button //
beth.style.backgroundColor = "#4CAF50";
betv.disabled = false;
betv.style.backgroundColor = "#008CBA";
beth.style.cursor = 'pointer';
betv.style.cursor = 'pointer';
}
if(counter==0){
counter1();
}
}, 1000);
}
我正在製作一個功能，單擊後按鈕將被禁用，但上面的計數器會自動啟用按鈕，但我希望它們都被執行。E. 單擊後禁用按鈕，如果計時器正在進行，則禁用按鈕，如果未單擊按鈕，則啟用按鈕
document.addEventListener('DOMContentLoaded', () => {
const myButton = document.getElementById('my-button');
const status = document.getElementById('status');
let counter = 10;
let timerHandle;
myButton.addEventListener('click', () => {
status.innerText = `Button will enable in ${counter} seconds`;
myButton.disabled = true;
timerHandle = setInterval(() => {
counter--;
status.innerText = `Button will enable in ${counter} seconds`;
if (counter === 0) {
clearInterval(timerHandle);
status.innerText = `Timer cleared.`;
myButton.disabled = false;
}
}, 1000);
});
});<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<style>
p {
color: red;
}
</style>
</head>
<body>
<div>
<p id="status"></p>
</div>
<div>
<button id="my-button">Button</button>
</div>
<script src="script.js"></script>
</body>
</html>本文收集自互联网，转载请注明来源。
如有侵权，请联系 [email protected] 删除。
我来说两句