计时点击按钮

<p><span id="shu">10</span><input id="anjian" type="button" value="a" disabled="disabled" /></p>
<script type="text/javascript">// <![CDATA[
window.setTimeout("Zhu()",1000)
function Zhu()

{
var s =document.getElementById("shu");
if(parseInt(s.innerHTML)<=0)
{
document.getElementById("anjian").removeAttribute("disabled");
}
else
{
s.innerHTML=parseInt(s.innerHTML)-1
window.setTimeout("Zhu()",1000)
}
}
// ]]></script>

 

转载于:https://www.cnblogs.com/wzs9/p/8743188.html

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
好的,下面是一个简单的示例代码,实现了一个基本的计时器功能: ``` <template> <div> <div>{{ formatTime }}</div> <button @click="start">开始</button> <button @click="pause">暂停</button> <button @click="stop">结束</button> </div> </template> <script> import { ref, computed } from 'vue'; export default { setup() { // 定义计时器相关的状态 const startTime = ref(0); const pausedTime = ref(0); const timer = ref(null); // 格式化时间 const formatTime = computed(() => { const totalSeconds = Math.floor((pausedTime.value - startTime.value) / 1000); const minutes = Math.floor(totalSeconds / 60).toString().padStart(2, '0'); const seconds = (totalSeconds % 60).toString().padStart(2, '0'); return `${minutes}:${seconds}`; }); // 开始计时 const start = () => { startTime.value = Date.now() - pausedTime.value; timer.value = setInterval(() => { pausedTime.value = Date.now(); }, 1000); }; // 暂停计时 const pause = () => { clearInterval(timer.value); }; // 停止计时 const stop = () => { clearInterval(timer.value); pausedTime.value = startTime.value = 0; }; return { formatTime, start, pause, stop, }; }, }; </script> ``` 在这个示例中,我们使用了 Vue 3 的 Composition API 来管理计时器相关的状态。我们使用了 `ref` 来创建响应式的状态,并且使用了 `computed` 来计算格式化后的时间。 当用户点击开始按钮时,我们记录当前时间,并且使用 `setInterval` 来不断更新暂停时间,以实现计时器的效果。当用户点击暂停按钮时,我们清除计时器,当用户点击停止按钮时,我们清除计时器并且重置所有的状态。 注意,我们使用了 `padStart` 来确保时间的格式为 `00:00`,即如果某个值小于 10,我们会在前面添加一个 0。这样,我们就可以确保格式化后的时间始终是两位数的分钟和秒数。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值