JavaScript实现计数器基础方法

本文实例为大家分享了js实现计数器的具体代码,供大家参考,具体内容如下

通过使用 JavaScript,设定的时间间隔之后来执行代码,而不是在函数被调用后立即执行。称之为计时事件。

在 JavaScritp 中使用计时事件是很容易的,两个关键方法是:

setInterval() - 间隔指定的毫秒数不停地执行指定的代码。
setTimeout() - 暂停指定的毫秒数后执行指定的代码

Note: setInterval() 和 setTimeout() 是 HTML DOM Window对象的两个方法。在这里只介绍了setTimeout()方法;

<!DOCTYPE html>
<html>

  <head>
    <meta charset="UTF-8">
    <script type="text/javascript">
      var c = 0
      var t

      function timedCount() {
        document.getElementById('txt').value = c;
        c = c + 1;
        //创建计时器,在指定周期内循环执行
        t = setTimeout("timedCount()", 1000);
      }

      function stopCount() {
        //清除计时器
        clearTimeout(t);
      }
    </script>
  </head>

  <body>

    <form>
      <input type="button" value="开始计时!" onClick="timedCount()">
      <input type="text" id="txt">
      <input type="button" value="停止计时!" onClick="stopCount()">
    </form>

  </body>

</html>

效果:

点击开始则会从0开始计数,停止计时则会暂停在那个时刻,再点击开始则会继续累加计数...但是这个程序有一个小bug,当不停的点击开始计时,计时的速度会增加,而且点击一次停止计时不会停止,要响应的点击很多次才可以停止.....

(0)

相关推荐

  • jsp网页计数器实现示例

    复制代码 代码如下: //过滤器类 public class EcondingFilter implements Filter { private String charset = null; private ServletContext context = null; private String path = ""; /** * 在销毁前将数据存入本地文件中 */ public void destroy() { //获取servleContext中的属性的那个值 String nu

  • jsp计数器代码

    <!-- JSP-Hitcounter counts sessions.Copyright (C) 2000 Jesper Schmitz Mouridsen. Visit www.webappcabaret/jsm2/webapps.jsp?find=jsphcs for more info. This program is free software; you can redistribute it and/or modify it under the terms of the GNU Ge

  • 使用JavaScript制作一个简单的计数器的方法

    设计思想 该方法的关键是Cookie技术和动态图像特性的综合运用.使用Cookie,可以在用户端的硬盘上记录用户的数据,下次访问此站点时,即可读取用户端硬盘的Cookie,直接得知来访者的身份和访问次数等有关信息.JavaScript中通过document.cookie属性访问Cookie,这个属性包括名字.失效日期.有效域名.有效URL路径等.用等号分开的名字和其值是Cookie的实际数据,本例中用来存储该访问者访问该页面的次数.通过把Web页中的图像映射到一个Images数组,一定条件下修改

  • 用JAVASCRIPT帮我写个计数器

    你们能用JAVASCRIPT帮我写个计数器吗?要带文本的那种,我在ASP那里要用呀?拜托..........      我自己写了一个,是不带文本的,谁能帮我弥补一下呢?      <%@   Language=Jscript   %> <%      Application.Lock();      Application("Counter")   =   parseInt(Application("Counter"))   +   1;   

  • jsp计数器制作手册

    计数器是一般网站必备的东东,别小看它了,每当站长看着小小计数器上的数字飞速增长的时候,感觉实在是好极了.以前我们用cgi.asp来写计数器,这方面的文章很多了,在这里,我们将会采用目前比较流行的jsp技术演示如何做一个计数器. 其中我们用到了两个文件,test.jsp文件用于在浏览器中运行,counter.java是后台的一个小java bean程序,用来读计数器的值和写入计数器的值.而对于计数器的保存,我们采用了一个文本文件lyfcount.txt. 下面是详细的程序代码(test.jsp放到

  • 一个简单的网站访问JS计数器 刷新1次加1次访问

    复制代码 代码如下: <script language="JavaScript"><!-- var caution = falsefunction setCookie(name, value, expires, path, domain, secure) {        var curCookie = name + "=" + escape(value) +                ((expires) ? "; expires=

  • js计数器代码

    复制代码 代码如下: <script Language="javascript">  var seconds = 10;//记数时间  var handle;//事件柄 //开始记数器  function startTimer() {   handle = setInterval("timer()",1000);  } //结束记数器  function stopTimer() {   clearInterval(handle);   seconds =

  • jsp计数器制作

    计数器是一般网站必备的东东,别小看它了,每当站长看着小小计数器上的数字飞速增长的时候,感觉实在是好极了.以前我们用cgi.asp来写计数器,这方面的文章很多了,在这里,我们将会采用目前比较流行的jsp技术演示如何做一个计数器.其中我们用到了两个文件,test.jsp文件用于在浏览器中运行,counter.java是后台的一个小java bean程序,用来读计数器的值和写入计数器的值.而对于计数器的保存,我们采用了一个文本文件lyfcount.txt. 下面是详细的程序代码(test.jsp放到w

  • 一个可以防止刷新的JSP计数器

    <%@ page contentType="text/html;charset=gb2312" %> <!--jsp计数器--> <%-- 以前学ASP时,用ASP做防止刷新的计数器很简单,以下是一个用JSP做的计数器--%> <html> <head> <title>jsp计数器</title> </head> <body> <%@ page import="j

  • javascript下计数器每秒自动加1

    var a = 0; function tran(){ var time = document.getElementById('time'); time.innerHTML = a++; window.setTimeout('tran()',1000); } window.setTimeout('tran()',1000); [Ctrl+A 全选 注:如需引入外部Js需刷新才能执行]

随机推荐