关于onclick函数调用的问题

利用JavaScipt的 DOM API下的 document对象做一个模拟计时器的练习，在下面代码中，当我在浏览器中运行的时候（在ie中不能运行），当我连续多次单击开始按钮后，后面的暂停按钮就无效，清零按钮会清零后，又自动重新运行，如果把开始按钮中的onclick改为onfocus，又是正常的，想请问各位，此处如果用onclick应该怎么设置，谢谢！！
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>计时器</title>
<script>
var hh=00;
var mm=00;
var ss=00;
var ms=00;

var time;

//开始
function start(){
time = window.setInterval(function(){
ms++;
if(ms===100){
ms=0;
ss++;
}
if(ss === 60){
ss=0;
mm++;
} 
if(mm === 60 ){
mm=0;
hh++;
}

document.getElementById('time').value = hh+":"+ mm +":" + ss + ":"+ ms;
},1);
}

//暂停

function par(){
window.clearInterval(time);

}

//清零
function cle()
{
window.clearInterval(time);
hh = 00;
mm = 00;
ss = 00;
ms = 00;

document.getElementById('time').value = hh+":"+ mm +":" + ss + ":"+ ms;
 
}
</script>
</head>
<body>
<h3>计时器</h3><br />
<input type="text" id="time" value="00:00:00:00" />
<input type="button" value="开始" onclick="start()" />
<input type="button" value="暂停" onclick="par()" />
<input type="button" value="清零" onclick="cle()" />

</body>
</html>

解决方案 »

  1.   


    function start(){ 
    if(time) return;
    time = window.setInterval(function(){ 
    ms++; 
    if(ms===100){ 
    ms=0; 
    ss++; 
    } 
    if(ss === 60){ 
    ss=0; 
    mm++; 
    } 
    if(mm === 60 ){ 
    mm=0; 
    hh++; 
    } 
      

  2.   

    function par(){ 
    window.clearInterval(time); 
    tiime = null;
    }function cle() 
    { 
    window.clearInterval(time); 
    time = null;
    hh = 00; 
    mm = 00; 
    ss = 00; 
    ms = 00; document.getElementById('time').value = hh+":"+ mm +":" + ss + ":"+ ms; }