gJakeHollandd
New Member
\[code\]toggleTest\[/code\] is a function:\[code\]function toggleTest() { if(document.testRunning) { stopTest(); } else { startTest(); }};\[/code\]When I click on the button, I activate the line:\[code\]<input type="button" onclick="toggleTest()" id="toggleBtn" value="http://stackoverflow.com/questions/15593233/Stop Test" /><br />\[/code\]and I get error \[code\]Uncaught ReferenceError: toggleTest is not defined\[/code\] I do not understand why I get the error if the function is defined.Demo jsFiddleAll the code:\[code\]<!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.checked == true) { document.testType = radios.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 = "http://stackoverflow.com/questions/15593233/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="http://stackoverflow.com/questions/15593233/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>\[/code\]