当前位置: 首页 > 图文教程 > 网络编程 > Javascript > javascript延时重复执行函数 lLoopRun.js

Javascript
javascript 响应键盘特定按键(只响应数字键)
javascript indexOf方法、lastIndexOf 方法和substring 方法
javascript parseInt 函数分析(转)
javascript Split方法,indexOf方法、lastIndexOf 方法和substring 方法
JavaScript 面向对象入门精简篇
JS中==与===操作符的比较
JavaScript indexOf忽略大小写
dwr spring的集成实现代码
DWR Ext 加载数据
JavaScript 计算当天是本年本月的第几周
Js 获取当前日期时间及其它操作实现代码
javascript multibox 全选
JS array 数组详解
javascript 对象定义方法 简单易学
javascript 补零 函数集合
div scroll始终在最底部的实现代码
javascript eval()用法
javascript 打印页面代码
JAVASCRIPT THIS详解 面向对象
javascript 页面跳转方法集合

Javascript 中的 javascript延时重复执行函数 lLoopRun.js


出处:互联网   整理: 软晨网(RuanChen.com)   发布: 2009-09-12   浏览: 358 ::
收藏到网摘: n/a

function lLoopRun(sFuncLoop,sFuncEnd,nDelay) {
//writen by http://fengyan.iecn.cn
//sFuncLoop >> 字符串型,需要重复执行的Javascript函数或语句(多个函数或语句请用;分隔)
//sFuncEnd >> 字符串型,用于中止重复执行动作(sFuncLoop)的Javascript函数或语句
//nDelay >> 数字型,重复执行的时间间隔(毫秒数)
var vintervalId = null;
var runString = sFuncLoop;
var stopString = sFuncEnd;
var delayTime = nDelay;
//var nCount = 0;//执行次数//为便于测试,应用时就将此行注释掉
this._doLoop = function (){
if (vintervalId && !eval(stopString)){
eval(runString);
//nCount++;//记录执行次数//为便于测试,应用时就将此行注释掉
} else {
window.clearInterval(vintervalId);
vintervalId = null;
}
//document.getElementById("TestCount").innerHTML = nCount;//输出执行次数//为便于测试,应用时就将此行注释掉
}
window.clearInterval(vintervalId);
vintervalId = window.setInterval(this._doLoop,delayTime);
}
几个实例代码:
水平往复运动:
<html>
<head>
<title>lLoopRun.js 应用实例:水平往复运动</title>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<meta name="Author" content="CnLei,枫岩" />
<style type="text/css">
#IECN {position:absolute;}
</style>
<script type="text/javascript" src="lLoopRun.js"></script>
</head>
<body>
<p>执行次数:<strong id="TestCount">0</strong></p>
<img id="IECN" src="http://bbs.iecn.net/attach-iecn/upload/7574.gif" style="left:0px;top:0px;" width="120" />
<script type="text/javascript">
<!--
function chgPos(sId,n){
var o = document.getElementById(sId);
o.style.left = (parseInt(o.style.left)+n)+"px";
}
function chgPosStop(sId,nMax){
var o = document.getElementById(sId);
if(parseInt(o.style.left)<0){isReBack = false;}
if(parseInt(o.style.left)>nMax){isReBack = true;}
if(isReBack) {
nNum=-Math.abs(nNum);
} else {
nNum=Math.abs(nNum);
}
}
var nNum=10;
var isReBack = false;
lLoopRun("chgPos(’IECN’,nNum);","chgPosStop(’IECN’,600)",20);
-->
</script>
</body>
</html>

自动伸缩大小:
<html>
<head>
<title>lLoopRun.js 应用实例:自动伸缩大小</title>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<meta name="Author" content="CnLei,枫岩" />
<script type="text/javascript" src="lLoopRun.js"></script>
</head>
<body>
<p>执行次数:<strong id="TestCount">0</strong></p>
<img id="IECN" src="http://bbs.iecn.net/attach-iecn/upload/7574.gif" style="left:0px;top:0px;" width="120" />
<script type="text/javascript">
<!--
function chgPos(sId,n){
var o = document.getElementById(sId);
o.width = (parseInt(o.width)+n);
}
function chgPosStop(sId,nMax){
var o = document.getElementById(sId);
if(parseInt(o.width)<10){isReBack = false;}
if(parseInt(o.width)>nMax){isReBack = true;}
if(isReBack) {
nNum=-Math.abs(nNum);
} else {
nNum=Math.abs(nNum);
}
//return parseInt(o.style.left)>nMax || (parseInt(o.style.top)>nMax-200);
}
var nNum=10;
var isReBack = false;
lLoopRun("chgPos(’IECN’,nNum);","chgPosStop(’IECN’,500)",20);
-->
</script>
</body>
</html>

垂直往复运动:
<html>
<head>
<title>lLoopRun.js 应用实例:垂直往复运动</title>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<meta name="Author" content="CnLei,枫岩" />
<style type="text/css">
#IECN {position:absolute;}
</style>
<script type="text/javascript" src="lLoopRun.js"></script>
</head>
<body>
<p>执行次数:<strong id="TestCount">0</strong></p>
<img id="IECN" src="http://bbs.iecn.net/attach-iecn/upload/7574.gif" style="left:0px;top:0px;" width="120" />
<script type="text/javascript">
<!--
function chgPos(sId,n){
var o = document.getElementById(sId);
o.style.top = (parseInt(o.style.top)+n)+"px";
}
function chgPosStop(sId,nMax){
var o = document.getElementById(sId);
if(parseInt(o.style.top)<0){isReBack = false;}
if(parseInt(o.style.top)>nMax){isReBack = true;}
if(isReBack) {
nNum=-Math.abs(nNum);
} else {
nNum=Math.abs(nNum);
}
//return parseInt(o.style.top)>nMax || (parseInt(o.style.top)>nMax-200);
}
var nNum=10;
var isReBack = false;
lLoopRun("chgPos(’IECN’,nNum);","chgPosStop(’IECN’,300)",20);
-->
</script>
</body>
</html>

渐变显示(图片):
<html>
<head>
<title>lLoopRun.js 应用实例: 渐变显示效果</title>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<meta name="Author" content="CnLei,枫岩" />
<style type="text/css">
body{background:#080;color:#fff;}
#IECN {
background:#fff;
filter: Alpha(opacity=10);
-moz-opacity:.10;
opacity:.10;
}
</style>
<script type="text/javascript" src="lLoopRun.js"></script>
</head>
<body>
<p>执行次数:<strong id="TestCount">0</strong></p>
<img id="IECN" src="http://bbs.iecn.net/attach-iecn/upload/7574.gif" style="left:0px;top:0px;" width="120" /><br /><br />刷新再次查看演示效果
<script type="text/javascript">
<!--
function chgOpacity(sId,n){
var o = document.getElementById(sId);
if (o.filters) {
o.filters[0].Opacity = parseInt(o.filters[0].Opacity) + n;
} else {
o.style.opacity= eval(document.defaultView.getComputedStyle(o,null).getPropertyValue(’opacity’)) + (n*100/10000);
}
}
function chgOpacityStop(sId){
var o = document.getElementById(sId);
if (o.filters) {
return parseInt(o.filters[0].Opacity)>=99;
} else {
return eval(o.style.opacity)>=0.99;
}
}
lLoopRun("chgOpacity(’IECN’,1);","chgOpacityStop(’IECN’)",20);
-->
</script>
</body>
</html>

原文:http://fengyan.iecn.cn/blog-html-do-showone-uid-35653-type-blog-itemid-2320.html