2013-03-23 104 views
0

toggleTest是一個函數:未捕獲的ReferenceError:未定義toggleTest

function toggleTest() { 
    if(document.testRunning) { 
     stopTest(); 
    } else { 
     startTest(); 
    } 
}; 

當我按一下按鈕,我激活行:

<input type="button" onclick="toggleTest()" id="toggleBtn" value="Stop Test" /><br /> 

,我得到錯誤Uncaught ReferenceError: toggleTest is not defined我做不明白爲什麼如果函數被定義,我會得到錯誤。

Demo jsFiddle

所有代碼:

<!DOCTYPE html> 
<html> 
<head> 
<title>HTML5 Canvas Drawing Speed Tests</title> 
<script type="text/javascript"> 
window.onload=function(){ 
window.requestAnimFrame = (function(){ 
    return window.requestAnimationFrame  || 
      window.webkitRequestAnimationFrame || 
      window.mozRequestAnimationFrame || 
      window.oRequestAnimationFrame  || 
      window.msRequestAnimationFrame  || 
      function(callback){ 
      window.setTimeout(callback, 1000/60); 
      }; 
})(); 
window.cancelRequestAnimFrame = (function() { 
    return window.cancelAnimationFrame   || 
     window.webkitCancelRequestAnimationFrame || 
     window.mozCancelRequestAnimationFrame  || 
     window.oCancelRequestAnimationFrame  || 
     window.msCancelRequestAnimationFrame  || 
     clearTimeout 
})(); 

function toggleTest() { 
    if(document.testRunning) 
    { 
     stopTest(); 
    } 
    else 
    { 
     startTest(); 
    } 
}; 

function changeTestType() { 
    stopTest(); 
    startTest(); 
} 

function startTest() { 
    if(toggleBtn == "Start Test"){ 
     var radios = document.getElementsByName("testType"); 
       for(var i = 0; i < radios.length; i++) 
       { 
        if(radios[i].checked == true) 
        { 
         document.testType = radios[i].id; 
         document.useRAF = true; 
         break; 
        } 
       } 
     if(document.useRAF){ 
      document.testInterval = setInterval(function() {runTest();}, 1000/60);} 
      document.testRunning = true;  
      runTest(); 
     } 
} 

function stopTest() { 
    if(!document.useRAF) 
     clearInterval(document.testInterval); 
    else 
     cancelRequestAnimFrame(document.requestAnimFrameId); 
    document.testRunning = false; 
    document.getElementById("toggleBtn").value = "Start Test"; 
} 

function runTest() { 
    if(document.useRAF) 
     document.requestAnimFrameId = requestAnimFrame(runTest); 
     document.testType(); 
} 

var ToggleBtn = document.getElementById("toggleBtn").value; 
} 
</script> 
</head> 
<body > 
    <div id="canvasContainer" style="position: relative;"> 
     <canvas id="testCanvas" width="180" height="50" style="background-color:black">Sorry your browser doesn't support the HTML5 canvas!</canvas> 
    </div> 
    <div id="debugData" style="position: relative;"> 
     <div id="debugControls" style="position:absolute;top:60px;left:0"> 
      <form id="testForm"> 
      <input type="button" onclick="toggleTest()" id="toggleBtn" value="Stop Test" /><br /> 
      <label><input type="checkbox" id="rAF" onclick="changeTestType()" />Use requestAnimationFrame</label><br /><br /> 
      <label><input type="radio" onchange="changeTestType()" name="testType" id="functionA" />functionA</label><br /> 
      <label><input type="radio" onchange="changeTestType()" name="testType" id="functionB" />functionB</label><br /> 
      <label><input type="radio" onchange="changeTestType()" name="testType" id="functionC" />functionC</label><br /> 
      <label><input type="radio" onchange="changeTestType()" name="testType" id="functionD" />functionD</label><br /> 
      </form> 
     </div> 
    </div> 
</body> 
</html> 

回答

2

因爲你把你的代碼中的window.onload它創建功能和toggleTest在功能範圍定義!只是把它移到全球範圍內http://jsfiddle.net/TEt8R/1/

//change to be in body 
+0

很多謝謝.............. – user1954217 2013-03-23 23:32:32

相關問題