当前位置:K88软件开发文章中心编程语言JavaScriptJS01 → 文章内容

jquery 定时器的使用

减小字体 增大字体 作者:wangsdong     来源:asp编程网  发布时间:2018-12-30 8:58:56

在页面上定时做某些事,如:站内短信提醒:当发信人给收件人发送一条短信,收件人在浏览此网站的时候,网站右下角会弹出一个框,提醒收件人已经收到一条短信,收件人可通过点击提醒,查看他的短信。

以下我写了一个例子,综合了几个具体功能在一起:

1、jquery修改页面上某个div中的内容

2、时间格式化功能

3、定时器设置,开始和停止

代码如下:

<
html xmlns="http://www.w3.org/1999/xhtml">
<
head>
<
title>
jquery定时器使用方法<
/title>
<
meta http-equiv="Content-Type" content="text/html
charset=utf-8" />
<
style type="text/css">

#div1
{ font-size:36px
color:
#f00
font-weight:bold
}<
/style>
<
/head>
<
body>
<
div id="div1">
<
/div>
<
script type="text/javascript" src="http://www.K88.NET/js/jquery.js">
<
/script>
<
input type="button" name="startChat" id="startChat" value="开始">
<
input type="button" name="closeChat" id="closeChat" value="停止">
<
script type="text/javascript">
$(function()
{ chat()
run()
//加载页面时启动定时器 var interval
//定义一个定时器 function run()
{ interval = setInterval(chat, "1000")
//定时的设置 } function chat()
{ var d=new Date().format('yyyy-MM-dd hh:mm:ss')
$("
#div1").html(d)
//jquery修改页面上div中的内容 } $("
#closeChat").click(function()
{ clearTimeout(interval)
//关闭定时器 }) $("
#startChat").click(function()
{ chat()
interval = setInterval(chat, "1000")
//启动定时器 }) })
Date.prototype.format = function(format)
{var o =
{"M+" : this.getMonth()+1, //month"d+" : this.getDate(), //day"h+" : this.getHours(), //hour"m+" : this.getMinutes(), //minute"s+" : this.getSeconds(), //second"q+" : Math.floor((this.getMonth()+3)/3), //quarter"S" : this.getMilliseconds() //millisecond}if(/(y+)/.test(format)) format=format.replace(RegExp.$1,(this.getFullYear()+"").substr(4 - RegExp.$1.length))
for(var k in o)if(new RegExp("("+ k +")").test(format))format = format.replace(RegExp.$1,RegExp.$1.length==1 ? o[k] :("00"+ o[k]).substr((""+ o[k]).length))
return format
}<
/script>
<
/body>
<
/html>
(鼠标移到代码上去,在代码的顶部会出现四个图标,第一个是查看源代码,第二个是复制代码,第三个是打印代码,第四个是帮助)




jquery 定时器的使用