js 自动播放的实例代码


Posted in Javascript onNovember 19, 2013
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html> 
<head> 
<meta http-equiv="content-type" content="text/html; charset=utf-8" /> 
<title>auto play</title> 
<script type="text/javascript" src="../jquery-1.8.0.min.js" /></script> 
<script type="text/javascript"> 
    //数组的第一项为时长,其他项可自定义 
    data = [["3","a"],["2","b"],["3","c"],["2","d"],["1",""]];     $(document).ready(function(){ 
        //设置触发事件 
        autoPlay.run = function(obj,num){ 
            back(obj,num); 
        }; 
        autoPlay(); 
    }); 
    function back(obj,num){ 
        $("#div_show").html(obj[num][1]); 
    } 
    function autoPlay(){ 
        //初始化计数参数 
        if(autoPlay.num ==undefined) 
            autoPlay.num = 0; 
        //初始化时间点 
        if(autoPlay.timepoint ==undefined) 
            autoPlay.timepoint = new Date().getTime(); 
        if(autoPlay.num<data.length){ 
            //函数句柄,data 数组,autoPlay.num当前下标 
            autoPlay.run(data,autoPlay.num); 
            //按照元素时间长度播放数组 
            if(new Date().getTime()>autoPlay.timepoint){ 
                //判断是否为第一次执行 
                if(autoPlay.first==undefined) 
                    autoPlay.first = true; 
                else 
                    autoPlay.num++; 
                //设置下一次播放的时间点 
                autoPlay.timepoint += (data[autoPlay.num][0]*1000); 
            } 
            setTimeout("autoPlay()",500); 
        } 
    } 
    $.extend({autoPlay:function(){ 
        var defaults = {inteval:500}; 
    }}); 
</script> 
</head> 
<body> 
<div id="div_show"></div> 
</body> 
</html>

定义播放时间,可以定义事件
Javascript 相关文章推荐
Ext JS Grid在IE6 下宽度的问题解决方法
Feb 15 Javascript
斜45度寻路实现函数
Aug 20 Javascript
Jquery进度条插件 Progress Bar小问题解决
Jul 12 Javascript
jquery load事件(callback/data)使用方法及注意事项
Feb 06 Javascript
javascript的解析执行顺序在各个浏览器中的不同
Mar 17 Javascript
js实现按一下删除键删除整个单词附demo
Sep 05 Javascript
轻松学习jQuery插件EasyUI EasyUI创建树形网络(1)
Nov 30 Javascript
bootstrap导航栏、下拉菜单、表单的简单应用实例解析
Jan 06 Javascript
微信小程序使用radio显示单选项功能【附源码下载】
Dec 11 Javascript
Vue Router的懒加载路径的解决方法
Jun 21 Javascript
koa+jwt实现token验证与刷新功能
May 30 Javascript
配置node服务器并且链接微信公众号接口配置步骤详解
Jun 21 Javascript
鼠标滚轴控制文本框值的JS代码
Nov 19 #Javascript
jquery交替变换颜色的三种方法 实例代码
Nov 19 #Javascript
jquery ajax的success回调函数中实现按钮置灰倒计时
Nov 19 #Javascript
详解jQuery插件开发中的extend方法
Nov 19 #Javascript
Js 导出table内容到Excel的简单实例
Nov 19 #Javascript
js文本框输入点回车触发确定兼容IE、FF等
Nov 19 #Javascript
jquery.autocomplete修改实现键盘上下键自动填充示例
Nov 19 #Javascript
You might like
PHP生成便于打印的网页
2006/10/09 PHP
PHP脚本中include文件出错解决方法
2008/11/20 PHP
PHP 图片文件上传实现代码
2010/12/29 PHP
Zend Studio (eclipse)使用速度优化方法
2011/03/23 PHP
PHP模板引擎Smarty内置变量调解器用法详解
2016/04/11 PHP
分享php多功能图片处理类
2016/05/15 PHP
JavaScript日历实现代码
2010/09/12 Javascript
jQuery中ajax的使用与缓存问题的解决方法
2013/12/19 Javascript
不能不知道的10个angularjs英文学习网站
2016/03/23 Javascript
dul无法加载bootstrap实现unload table/user恢复
2016/09/29 Javascript
原生JS实现圣旨卷轴展开效果
2017/03/06 Javascript
原生js实现简单的模态框示例
2017/09/08 Javascript
利用Javascript开发一个二维周视图日历
2017/12/14 Javascript
微信小程序实现星星评价效果
2018/11/02 Javascript
搭建vscode+vue环境的详细教程
2020/08/31 Javascript
vue实现两个组件之间数据共享和修改操作
2020/11/12 Javascript
vue element实现表格合并行数据
2020/11/30 Vue.js
[01:09:13]DOTA2-DPC中国联赛 正赛 CDEC vs XG BO3 第三场 1月19日
2021/03/11 DOTA
Python中为什么要用self探讨
2015/04/14 Python
python3实现ftp服务功能(服务端 For Linux)
2017/03/24 Python
python 应用之Pycharm 新建模板默认添加编码格式-作者-时间等信息【推荐】
2019/06/17 Python
用Python在Excel里画出蒙娜丽莎的方法示例
2020/04/28 Python
基于Python爬虫采集天气网实时信息
2020/06/05 Python
python 解决selenium 中的 .clear()方法失效问题
2020/09/01 Python
Python实现迪杰斯特拉算法过程解析
2020/09/18 Python
Python实例教程之检索输出月份日历表
2020/12/16 Python
Coach澳大利亚官方网站:美国著名时尚奢侈品牌
2017/05/24 全球购物
Myprotein瑞典官方网站:畅销欧洲英国运动营养品牌
2018/01/22 全球购物
什么是索引指示器
2012/08/20 面试题
寒假实习自荐信
2014/01/26 职场文书
委托证明范本
2014/11/25 职场文书
2015年爱牙日活动总结
2015/03/23 职场文书
跳高加油稿
2015/07/21 职场文书
队名及霸气口号大全
2015/12/25 职场文书
四年级语文教学反思
2016/03/03 职场文书
CSS实现五种常用的2D转换
2021/12/06 HTML / CSS