一个简单的进度条演示。<!doctype html><html><head><meta charset="utf8"><title>Process Bar</title><scrip ...
一个简单的进度条演示。
<!doctype html><html><head><meta charset="utf8"><title>Process Bar</title><script>var t;function s(c){ if(c<=100) { val.style.width=c+"%"; percent.innerHTML=c+"%"; btn.disabled=true; btnp.disabled=false; c=c+10; t=setTimeout("s("+c+")",500); } else { clearTimeout(t); btnc.disabled=false; btnp.disabled=true; return; }}function c(){ clearTimeout(t); val.style.width="0px"; percent.innerHTML="0%"; btn.disabled=false; btnc.disabled=true; btnp.disabled=true; btnp.value='Pause';}function p(){ var temp; if('Pause' == btnp.value) { clearTimeout(t); btnp.value='Go on'; btnc.disabled=false; } else { temp=val.style.width; btnp.value='Pause'; var k=parseInt(delEnd(temp)); s(k); btnc.disabled=true; } }function delEnd(str){ var temp=""; for(var i=0; i < str.length-1; i++) { temp=temp+str[i]; } return temp;}</script></head><body><div id="bar" > <div id="val" ></div></div><div id="percent" >0%</div><div ></div><br /><input id="btn" type="button" value="Start" onClick="s(0)" /><br /><input id="btnc" type="button" value="Clear" onClick="c()" disabled /><br /><input id="btnp" type="button" value="Pause" onClick="p()" disabled /></body></html>
海外公司注册、海外银行开户、跨境平台代入驻、VAT、EPR等知识和在线办理:https://www.xlkjsw.com
原标题:Javascript进度条
关键词:JavaScript
*特别声明:以上内容来自于网络收集,著作权属原作者所有,如有侵权,请联系我们:
admin#shaoqun.com
(#换成@)。