javascript加載順序問題(二)

<!-- lang: html -->
<!DOCTYPE html>
<!-- lang: html -->
<html>
<!-- lang: html -->
<head>
<!-- lang: html -->
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<!-- lang: html -->
</head>
<!-- lang: html -->
<body >
<!-- lang: html -->
<form>
<!-- lang: html -->
    <div  class="test" style="background-color:#00ff00;height:400px;width:400px" >
<!-- lang: html -->
        <div></div>
<!-- lang: html -->
        <div></div>
<!-- lang: html -->
    </div>
<!-- lang: html -->
    <div class="test" style="background-color:#ff0000;height:400px;width:400px" >
<!-- lang: html -->
        <div></div>
<!-- lang: html -->
        <div></div>
<!-- lang: html -->
    </div>
<!-- lang: html -->
    <input type="button" value="開始計時!" >
<!-- lang: html -->
    <input type="text" id="txt">
<!-- lang: html -->
</form>
<!-- lang: html -->
<script type="text/javascript">
<!-- lang: html -->
    var t;
<!-- lang: html -->
    var t1;
<!-- lang: html -->
    var m = 0;
<!-- lang: html -->
    var temp = 0;
<!-- lang: html -->

<!-- lang: html -->
            function timedCount(n) {
<!-- lang: html -->
                if (n==0){
<!-- lang: html -->
                    document.getElementById('txt').value = m;
<!-- lang: html -->
                    m = m+1;
<!-- lang: html -->
                }
<!-- lang: html -->
                else{
<!-- lang: html -->
                    document.getElementById('txt').value = temp;
<!-- lang: html -->
                    temp = temp+1;
<!-- lang: html -->
                }
<!-- lang: html -->

<!-- lang: html -->
                t = setTimeout("timedCount("+n+")", 100);
<!-- lang: html -->

<!-- lang: html -->
            };
<!-- lang: html -->

<!-- lang: html -->
            function stopCount() {
<!-- lang: html -->
                clearTimeout(t);
<!-- lang: html -->
            };
<!-- lang: html -->

<!-- lang: html -->
  /*    for (var j=0; j<2; j++){ 
<!-- lang: html -->
    document.getElementsByClassName("test")[j].onmouseover=function(){timedCount(j)};
<!-- lang: html -->
    document.getElementsByClassName("test")[j].onmouseout=function(){stopCount()};
<!-- lang: html -->
    }*/
<!-- lang: html -->
            document.getElementsByClassName("test")[0].onmouseover=function(){timedCount(0)};
<!-- lang: html -->
       //    document.getElementsByClassName("test")[j].onmouseover=function(){testedTime()};
<!-- lang: html -->
            document.getElementsByClassName("test")[0].onmouseout=function(){stopCount()};
<!-- lang: html -->

<!-- lang: html -->
            document.getElementsByClassName("test")[1].onmouseover=function(){timedCount(1)};
<!-- lang: html -->
            document.getElementsByClassName("test")[1].onmouseout=function(){stopCount()};
<!-- lang: html -->
   //    }
<!-- lang: html -->
  //  }
<!-- lang: html -->

<!-- lang: html -->
</script>
<!-- lang: html -->
</body>
<!-- lang: html -->
</html>

若是是上面這樣的話,能夠分別在兩個不一樣區域計算時間,可是若是用遞歸的話,就會有問題。不明其中的原理。javascript

相關文章
相關標籤/搜索