使用js需求:按钮60s后才可以使用 分析: 1.开始先把按钮禁用(disabled属性) 2.一定要获取元素 3.函数内处理逻辑 秒数开始递减 按钮里面的文字跟着一起变化 如果秒数等于0停止定时器 里面的文字变为同意 最后按钮可以被点击
时间: 2024-02-14 11:13:03 浏览: 90
好的,根据您的需求,我可以提供以下JavaScript代码实现:
首先,需要获取到需要设置倒计时的按钮元素,可以通过`document.getElementById()`方法获取:
```javascript
const button = document.getElementById('myButton');
```
然后,需要创建一个计时器函数,用于每秒更新按钮上的文字和倒计时的秒数。在函数内部,需要对秒数进行递减,并将递减后的秒数和相应的文字更新到按钮上。如果秒数等于0,需要停止计时器,将按钮上的文字更新为“同意”,并将按钮的`disabled`属性设置为`false`,表示按钮可以被点击了。
```javascript
function countdown(seconds) {
let timer = setInterval(() => {
seconds--;
button.innerText = `请等待 ${seconds} 秒`;
if (seconds === 0) {
clearInterval(timer);
button.innerText = '同意';
button.disabled = false;
}
}, 1000);
button.disabled = true;
}
```
最后,在需要设置倒计时的地方调用该函数即可,例如:
```javascript
countdown(60);
```
这样,就可以在按钮被点击后,禁用按钮并设置60秒的倒计时,倒计时结束后按钮重新可用,文字变为“同意”。
阅读全文