I have some html/javascript that works in my .cshtml file.
When I try to move it in to jsfiddle to experiment with, it does not work.
Not sure if if it's my lack of javascript experience, jsfiddle experience, probably both....
html:
<div>
<button name="startBtn" id="startBtn" onclick="startTimer">Start</button>
</div>
(I have also tried "startTimer()" for the onclick attribute; same result.)
javascript:
function startTimer() { alert("startTimer"); }
When I click the button, I see this in the Console:
Uncaught ReferenceError: startTimer is not defined
What am I overlooking?
(jsfiddle: http://bit.ly/1buQx9t)
First you have to set the Framework to No wrap - in <head>
, instead of onLoad
.
Description
onLoad
is the same as window.onload=function(){[YOU ARE TYPING HERE]}
in JavaScript or $(function(){[YOU ARE TYPING HERE]});
in jQuery.
No wrap - in <head>
is the same as <head><script type="text/javascript">[YOU ARE TYPING HERE]</script</head>
No wrap - in <body>
is the same as <body>[HTML CODE HERE]<script type="text/javascript">[YOU ARE TYPING HERE]</script></head>
I hope this clears up the settings in jsFiddle, they can be somewhat confusing.
Second your HTML
is slightly wrong:
HTML
<div>
<input type="button' value='"Start" onclick="startTimer()"/>
</div>
Description
onclick="startTimer"
was changed to onclick="startTimer()"
this will execute the function.
First issue: You have the jsfiddle to set on onload so the function is not in global scope.
Second issue, you are not calling the function. You are missing ()
onclick="startTimer()"
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With