Javascript Onclick Not Working In Jsfiddle

June 25, 2024 Post a Comment

I am trying to make jsfiddle , my onclick is not working in jsfiddle. what is wrong in my code function myclick(){

Solution 1:

You need to select No library (pure JS) and No wrap - in head. Then it will work as a simple HTML with javascript page.

This will be inserted in a <script> element in the <head>:

function myclick(){
  alert("myclick")
}

See demo

Solution 2:

As others said, for first case you have to set No wrap - in <head> or No wrap - in <body> as javascript panel settings (the blue link at js panel top-right).

For the second (your Edit) question, your code inside a function and the js will run it (within a new context), but it will do nothing as you just define a function and ignore it without any call or assignment.

if you call alert(myclick) you will see all the code is executed and its defined at that point. see this fiddle

$(document).ready(function() {

  //alert("ready is executed");functionmyclick(){
    alert("myclick is called")
    window.location.reload(true);
  }

  alert(myclick); //this will show the myclick is a defined function!//document.getElementsByTagName("input")[0].onclick = myclick;
})

if you call this:

document.getElementsByTagName("input")[0].onclick = myclick;

in that $(document).ready({...}) scope, it will be assigned to the button and works as you wish.

Solution 3:

<input value="press" id='a'type="button">
document.getElementById('a').onclick = function() { alert(1); }

http://jsfiddle.net/gs6rehnx/12/

Solution 4:

This one is working. Just remove it from document ready event. Also semicolons are optional in javascript but i advice to use them.

functionmyclick() {
    alert("myclick");
    window.location.reload(true);
}

<inputvalue="press"type="button"onclick="myclick();"><script>alert("home");
</script>

Here is the fiddle.

Solution 5:

Select "No wrap - bottom of " in "Load Type" of the scripting panel. This is the solution for Jsfiddle (till 17 december 2019).

Html5 Log