Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Uncaught ReferenceError: <function> is not defined at HTMLButtonElement.onclick [duplicate]

I have created my problem on JSFiddle at https://jsfiddle.net/kgw0x2ng/5/. The code is as follows

HTML CODE

<div class="loading">Loading&#8230;</div> 
<button type="submit" onClick="hideButton()">Hide</button>
<button type="submit" onClick="showButton()">Show</button>

JS CODE

function hideButton(){
   $(".loading").hide();
}
function showButton(){
   $(".loading").show();
}

I am showing a spinner and I would like the spinner to hide when I click on the "Hide" button. I am getting the following error :

Uncaught ReferenceError: showButton is not defined
    at HTMLButtonElement.onclick (VM282:180)
onclick @ VM282:180
VM282:179  

Uncaught ReferenceError: hideButton is not defined
    at HTMLButtonElement.onclick (VM282:179)
onclick @ VM282:179.

Can someone please suggest a solution?

Thanks

Sachin

like image 886
sachinb Avatar asked Dec 26 '16 04:12

sachinb


1 Answers

Place your script inside the body tag

<body>
  // Rest of html
  <script>
  function hideButton() {
    $(".loading").hide();
  }
function showButton() {
  $(".loading").show();
}
</script> 
< /body>

If you check this JSFIDDLE and click on javascript, you will see the load Type body is selected

like image 121
brk Avatar answered Nov 14 '22 23:11

brk