进度条js：ProgressBar.js
function ProgressBar(bar) {
this.bar = bar;
this.speed = 50;
}
ProgressBar.prototype.move = function(moveing, callback) {
this.bar.style.width = parseInt(this.bar.style.width) + 1 + "%";
if(this.bar.style.width == "100%"){
window.clearInterval(moveing);
if (callback != null) {
callback();
}
}
}
ProgressBar.prototype.start = function(callback) {
var moveing = window.setInterval(function() {
bar.move(moveing, callback);
}, this.speed);
}
ProgressBar.prototype.clear = function() {
this.bar.style.width = "1%";
}
调用范例
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<TITLE>Progress Bar</TITLE>
<style type="text/css">
#graph{
width:450px;
border:1px solid #F8B3D0;
height:25px;
}
#bar{
display:block;
background:#FFE7F4;
float:left;
height:100%;
text-align:center;
}
</style>
</HEAD>
<BODY>
<div id="graph">
<strong id="bar" style="width:1%;"></strong>
</div>
</BODY>
<SCRIPT type="text/JavaScript" src="ProgressBar.js"></SCRIPT>
<SCRIPT type="text/JavaScript">
<!--
function a() {
alert('finish');
}
var bar = new ProgressBar(document.getElementById('bar')); // 构造方法，参数必须填
bar.speed = 20; // 设定间隔时间，非必须
bar.start(a); // a为回调方法，非必须
//-->
</SCRIPT>
</HTML>
分享到：
相关推荐
简单的使用javaScrpit实现进度条功能
通过`addEventListener`方法，我们可以为HTML元素绑定事件监听器，当特定事件发生时（如点击按钮），就会执行对应的JavaScript函数。 在你的项目中，很可能包含了使用JavaScript修改HTML元素、响应用户事件以及可能...
由于它可以在浏览器环境中运行，使得开发像扑克牌游戏这样的桌面游戏变得轻而易举。 首先，我们需要了解扑克牌的基本规则和构成。一副扑克牌通常包含52张牌，分为四种花色：红桃（Hearts）、黑桃（Spades）、梅花...
之前上传了一个树形菜单，是一个有问题的。我的菜单式没问题的，只是我上传的时候漏了一些东西，不好意思啊。现在给大家上传另外一个树形菜单。这个是没问题的啦，我自己试过了才上传的。大家放心~\(≧▽≦)/~啦啦啦
javascrpit算法
Promise、async/await等异步编程模式解决了回调地狱问题，提高了代码可读性。 8. **闭包** 闭包是JavaScript中的一个重要概念，它允许函数访问并操作其词法作用域内的变量，即使该函数在其外部被调用。 9. **原型...
例子
Promise则提供了一种更优雅的方式来处理异步操作，它可以链式调用，避免了“回调地狱”。async/await是Promise的语法糖，使得异步代码看起来更像同步代码，提高了代码的可读性。 学习JavaScript还涉及到浏览器API的...
HTML5+JavaScrpit微信小游戏源码
"02其他资料"可能涵盖了更高级的主题，如闭包、作用域、原型链、事件处理、DOM操作、异步编程（回调函数、Promise、async/await），还有可能涉及到模块化（CommonJS、ES6模块）以及一些常用的JavaScript库和框架，如...
3. **JavaScript调用Java Applet的方法**：在JavaScript中，可以直接通过Applet的名称来调用其公开的方法。 ```javascript function callAppletMethod() { myApplet.someMethod(); } ``` #### 五、示例代码...
根据提供的标题、描述、标签及部分内容，我们可以提炼出与JavaScript相关的多个知识点。下面将对这些知识点进行详细解读。 ### 1. JavaScript基础语法 #### 1.1 基本结构 - **引入JavaScript的方式**：可以使用`...
在JavaScript中实现树结构，通常需要掌握以下核心概念和方法： 1. **节点（Node）**：树的基本构成单元，每个节点包含数据和指向其子节点的引用。在JavaScript中，我们可以用对象来表示节点，例如： ```javascript...
100. 打包jquery拖动条拖动图片缩略图及放大图片效果插件(翻版thickbox插件) 101. 打包基于jQuery对图片边框修饰插件示例下载(支持图片阴影效果、顶部banner效果、邮票边框、毛边相框、云朵包围效果) 102. 推荐...
比如，如果需要在两个请求都完成后执行某些操作，可以这样做： ```javascript let promise1 = new Promise((resolve, reject) => { ajax({ url: 'url1', success: resolve, error: reject }); }); let promise2 =...
javascript、js、Extjs、Web脚本、Mvc