您现在的位置: 冰舟工作室 >> WEB开发 >> JavaScript >> 文章正文

经典源码JavaScript之计数器(倒数)

作者:佚名 文章来源:不详 点击数: 更新时间:2008-4-15 16:07:20

 

<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<script type="text/javascript">
/**
    * 计数器(倒数)
    * @author MoXie SysTem128@GMail.Com
    *
    * IE6,7 Firefox2.0 Opera 9.25 测试通过
    *
*/

var timer = {
    
// 元素id
    elId : null,
    
//    outTime : null,
    // 初始文本
    text : null,
    
// 技术文本格式
    countFormat : null,
    
// 当前数
    current : 0,
    
// 获取操作对象
    getEl : function(){
        
return document.getElementById(this.elId);
    }
,
    
// 计数
    counter : function(){
        
this.current--;
        
if (this.current>0){
            
this.writer(1);
        }
else if (this.current == 0){
            
this.writer(0);
            
this.onEnd();
        }

        
return true;
    }
,
    
// 显示
    writer : function(isCount){
        
var el = this.getEl();
        
if (!isCount)
        
{
            el.value 
= this.text;
        }
else{
            
var counterText = this.countFormat.replace("$count",this.current);
            el.value 
= this.text+counterText;
        }

    }
,
    
// 起始时触发的动作
    onStart : function(){},
    
// 中止时触发的动作
    onEnd : function(){},
    
// 初始化
    /**
    * elId 元素id
    * text 初始文本
    * outTime 个数
    * speed 速度 1000 = 1秒
    * countFormat 计数显示格式 嵌入数字使用 $count
    * onStart 起始 动作
    * onEnd 结束 动作
    *
*/

    init : 
function(elId,text,outTime,speed,countFormat,onStart,onEnd)
    
{
        
this.elId = elId;
        
this.text = text;
        
this.current = outTime+1;
        
this.countFormat = countFormat;
        
if (typeof(onStart) == "function")
        
{
            
this.onStart = onStart;
            onStart();
        }

        
if (typeof(onEnd) == "function")
        
{
            
this.onEnd = onEnd;
        }

        window.setInterval(
"timer.counter()",speed);
    }

}


// 这里留为自定义
var myStart = function(){
    
var el =document.getElementById("submitBtn").setAttribute("disabled",true);
    alert(
"Hello!");
}

var myEnd = function(){
    document.getElementById(
"submitBtn").removeAttribute("disabled")
    alert(
"Goodbye!");
}

</script>
<input type="submit" id="submitBtn" value="确认" />
<script type="text/javascript">
/**
* elId 元素id
* text 初始文本
* outTime 个数
* speed 速度 1000 = 1秒
* countFormat 计数显示格式 嵌入数字使用 $count
* onStart 起始 动作
* onEnd 结束 动作
*
*/

timer.init(
"submitBtn","确认",2,500,"($count)",myStart,myEnd);
</script>

 

For: http://topic.csdn.net/u/20080415/11/c0b864bb-9997-4fdd-bc9e-1a5821e720d3.html

加强代码质量呀……

越简单的东西越应该做好.



Trackback: http://tb.blog.csdn.net/TrackBack.aspx?PostId=2293526


  • 上一篇文章:

  • 下一篇文章:
  • 相关内容
    · JS 控制select表单
    · 经典源码JavaScript之计数器(倒数
    · 高手教程:jsp中根据传入值,用j
    · 使用DOS和javascript在html网页中
    · javascript函数之删除空格
    · javascript巧妙实现WORD里的斜线
    · 经典收藏JavaScript中常用的107条
    · JavaScript圣经之优化篇
    · JavaScript圣经之优化总结
    · IDv+Js+css切换效果
    · 图片幻灯切换代码(纯JS代码带演
    · 常用的107条Javascript
    · JavaScript 删除空格(trim)
    · Javascript 计算闰年
    · JavaScript静态页面值传递之Cook
    · html----javascript----只打开一
    · 妙用JavaScript实现网页的任意缩
    · 通过Javascript把页面导入到Exce
    · javascript
    · 常用的JavaScript语句集(转载)
    · JavaScript语言
    · javascript 实现的锁屏、解屏功能
    · 获取web页面大小、分辨率等信息(
    · php+javascript 静态化简单实例
    · javascript事件的绑定
    · javascript 详解各控件的操作
    · 最新Javascript按比例压缩图片,
    · javascript中的indexOf(),lastin
    · javascript截取字符串方法
    · ajax学习笔记一:面向对象的javas
    · Atlas学习笔记11:扩展javascrip
    · Javascript“画图”Asp.net版
    · dojo (a open source JavaScript
    · 用Acrobat Javascript 开发。
    · JavaScript技术要点
    · 免费的javascript写的控件组件
    · document 文挡对象
    · 用javascript检查文件大小
    · 小议Javascript代码优化方法及原
    · javascript控制lotus的rtf域
    · javascript学习
    · 在线压缩javascript
    · 随心所欲的Web页面打印技术(Asp.
    · javascript 写的tab页代码
    · javascript中replace()函数用法小
    · test

    CopyRights 2007-2008 冰舟工作室 All Rights Reserved
    www.bz918.com