进度条

	<h3>进度条</h3>
	<button onclick="start()">开始</button>
	<button onclick="stop()">暂停</button>
	<button onclick="end()">停止</button>
	<hr>
	<div id="wrap">
		<div id="jd"></div>
	</div>	
	<script>
		/*
			扩展

		*/ 
		// 获取对象
		var jdObj = document.getElementById("jd");
	
		// 设置定时器
		var timer;
		// 开始的位置
		var i = 0;
		var bj = false;  // 定时器没有运行的时候 false;

		// 运行
		function run(){
			if(i>100){
				clearInterval(timer);	
			}else{
				jdObj.style.width = i+'%';
				i++;				
			}
		}

		// 开始
		function start(){
			/*
			if(bj){
			}else{
				bj = true;
				timer = setInterval(run, 33)				
			}*/
			if(!bj){
				bj = true;
				timer = setInterval(run, 33)				
			}
		}

		// 暂停
		function stop(){
			bj = false;
			clearInterval(timer);
		}

		// 停止
		function end(){
			bj = false;
			i = 0;
			jdObj.style.width = '0';
			clearInterval(timer);
		}