一、setInterval()/clearInterval()技术学习

  都是window对象的方法,可以直接使用。

  setInterval(function(){},1000);:每1000毫秒执行一次函数;

  clearinterval(item);:清除setInterval()函数的设置,其中item是setInterval()的返回对象,例如:var item = setInterval();

二、页面计时器

  html页面中:

<head>
<script type="text/javascript" src="js/common/jquery-2.1.3.js"> </script>
</head>
<body>
<div>
<span class="time"></span>
<span class="stop">stop</span>
</div>
</body>

  页面内嵌入js代码:

<script type="text/javascript">
$(function(){
var sec = 0;
var min = 0;
var hour = 0;
var secStr;
var minStr;
var hourStr;
curTime = setInterval(function(){
sec = sec+1;
if(sec > 59){
min = min + 1;
sec = 0;
if(min > 59){
hour = hour + 1;
min = 0;
}
}
secStr = sec < 10 ?"0"+sec:sec;
minStr = min < 10 ?"0"+min:min;
hourStr = hour < 10 ?"0"+hour:hour;
$(".time").html(hourStr+":"+minStr+":"+secStr);
},1000);
$(".stop a").click(function(){
window.clearInterval(curTime);//必须将curTime作为参数传入到该方法中
});
});
</script>

js函数:setInterval()/clearInterval()——js网页计时器的更多相关文章

  1. js函数——setinterval和setTimeout

    1.window.setTimeout方法 该方法可以延时执行一个函数,例如: <script language="JavaScript" type="text/j ...

  2. 常用js函数整理--common.js

    var h = {}; h.get = function (url, data, ok, error) { $.ajax({ url: url, data: data, dataType: 'json ...

  3. 创建一个JS函数,运用JS中arguments对象

    Javascript中有个内置的arguments对象. arguments对象包含了参数调用的参数数组. <p>查找最大的数.</p> <p id="demo ...

  4. JS函数库Underscore.js

    http://underscorejs.org/ http://www.css88.com/doc/underscore/ http://www.bootcss.com/p/underscore/

  5. js函数的参数

    js函数的参数: js是弱类型的编程语言,调用函数时既不在乎函数的参数,也不在意参数的类型 即便你定义的函数值接受两个参数,在调用这个函数时也未必一定要是两个参数.可以传递一个.三个甚至不传递参数,而 ...

  6. 服务器控件调用JS函数

    是服务器端控件,不能在JS里直接调用,但可以在aspx.cs 里写方法可以调用JS函数,比如JS方法名称是check(), function check() {   alert(document.ge ...

  7. (转)在网页中JS函数自动执行常用三种方法

    原文:http://blog.sina.com.cn/s/blog_6f6b4c3c0100nxx8.html 在网页中JS函数自动执行常用三种方法 在网页中JS函数自动执行常用三种方法 在HTML中 ...

  8. 在网页中JS函数自动执行常用三种方法

    在网页中JS函数自动执行常用三种方法 在HTML中的Head区域中,有如下函数: <SCRIPT   LANGUAGE="JavaScript">   function ...

  9. js之制作网页计时器

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

随机推荐

  1. 以OpenGL方式运行Unity

    Unity在Windows上默认以DirextX的方式运行,在MacOS和Linux上默认以OpenGl的方式运行, 如果希望在Windows上以OpenGL的方式运行可以在命令行中输入 -force ...

  2. tcp 和 udp 缓冲区的默认大小及设置【转】

    1. tcp 收发缓冲区默认值 [root@ www.linuxidc.com]# cat /proc/sys/net/ipv4/tcp_rmem   4096    87380   4161536 ...

  3. 利用CSS3打造一组质感细腻丝滑的按钮

    CSS3引入了众多供功能强大的新特性,让设计和开发人员能够轻松的创作出各种精美的界面效果.下面这些发出闪亮光泽的按钮,漂亮吧?把鼠标悬停在按钮上,还有动感的光泽移动效果. 温馨提示:为保证最佳的效果, ...

  4. 让人心动的jQuery插件和HTML5动画

    1.jQuery/CSS3带表单的下拉菜单 今天要分享一款基于jQuery和CSS3的下拉菜单,这款jQuery下拉菜单非常特别,我们直接可以在下拉菜单中填写联系表单.登录表单.而且整个下拉菜单的外观 ...

  5. Eclipse 快捷键 快捷输入

    快捷键: 1. ctrl+shift+r:打开资源 这可能是所有快捷键组合中最省时间的了.这组快捷键可以让你打开你的工作区中任何一个文件,而你只需要按下文件名或mask名中的前几个字母,比如appli ...

  6. FTP协议及工作原理详解

    1. FTP协议 什么是FTP呢?FTP 是 TCP/IP 协议组中的协议之一,是英文File Transfer Protocol的缩写. 该协议是Internet文件传送的基础,它由一系列规格说明文 ...

  7. Entity Framework 一次加载许多个 Fluent API 映射

    可通过多种方法来指定模型的 Fluent 映射(从类到数据库). 1.直接在 DbContext 类的 OnModel­Creating 方法中进行映射,如下所示: protected overrid ...

  8. Gulp vs Grunt 前端构建工具对比

    Gulp vs Grunt 前端工程的构建工具对比 1. Grunt -> Gulp 早些年提到构建工具,难免会让人联想到历史比较悠久的Make,Ant,以及后来为了更方便的构建结构类似的Jav ...

  9. WordPress 主题开发 - (二) 理解主题 待翻译

    What is “Theme Sense”? What is “Theme Sense”? Theme Sense is an intuitive understanding of WordPress ...

  10. 文件上传下载struts2

    上传方式1: // 保存上传的文件 public boolean saveFile(File file, String fileName) throws IOException { File newF ...