Attribute Onclick="Function()" Not Functioning as Intended

Attribute onclick=function() not functioning as intended?

One of the many reasons not to use onxyz="..."-style event handlers is that any functions you call from them must be globals. Your functions aren't, they're local to the window.onload callback.

Instead, just assign the function reference directly, either somewhat old-fashioned:

left.onclick = playerLeft;

or using more modern techniques that allow for multiple handlers:

left.addEventListener("click", playerLeft);

onclick attribute not working even after the function is defined

function makecall must be defined in the global context:

window.makecall = function (data) {
  console.log(data);
};

Also, you need to sort out quotes and parenthesis in

activediv.innerHTML += '<p onclick="makecall(' + "'" + temp + "'" + 
  ');return false;")">' + temp + '</p><br/>';

you don't need )" after return false;".

How to make onclick function execute only once?

you could use removeAttribute() like this: document.getElementById('thumb0').removeAttribute("onclick");

or you could let the function return false like this: document.getElementById('thumb0').onclick = ()=> false

JavaScript - href vs onclick for callback function on Hyperlink

Putting the onclick within the href would offend those who believe strongly in separation of content from behavior/action. The argument is that your html content should remain focused solely on content, not on presentation or behavior.

The typical path these days is to use a javascript library (eg. jquery) and create an event handler using that library. It would look something like:

$('a').click( function(e) {e.preventDefault(); /*your_code_here;*/ return false; } );

How to stop event propagation with inline onclick attribute?

Use event.stopPropagation().

<span onclick="event.stopPropagation(); alert('you clicked inside the header');">something inside the header</span>

For IE: window.event.cancelBubble = true

<span onclick="window.event.cancelBubble = true; alert('you clicked inside the header');">something inside the header</span>

JavaScript 'onclick' event 'return' keyword functionality

Returning false from the function, will abort the effect of the checking. Because the native of functions that written hardcoded into html properties (it became some new local function), writing the html without the word "return" will just run the function, and lose its returning value, as if you've wrote:

function doAlert() {
   if(some_condition)
     return false;
   else
     return true;
}
function some_local_function() {
   doAlert();
}

Function some_local_function won't return any value, although doAlert returns.

When you write "return", it's like you wrote the second function like this:

function some_local_function() {
   return doAlert();
}

which preserves the returning value of doAlert, whatever it will be. If it's true - the action will perform (the checkbox will be checked) - otherwise - it will cancel.

You can see live expamle here: http://jsfiddle.net/RaBfM/1/

onClick / onclick does not seem to be working as expected in HTML5 / JavaScript

the problem is the name of your function. it is the same as the id of the element. do a test an try writing this console.log(add). You will see it logs the DOM node and not the function.

is your button in a form ? because if so, then the form is submited and that's why the the page refreshes. can you post a jsfiddle with your test ?

How to use onClick() or onSelect() on option tag in a JSP page?

Neither the onSelect() nor onClick() events are supported by the <option> tag. The former refers to selecting text (i.e. by clicking + dragging across a text field) so can only be used with the <text> and <textarea> tags. The onClick() event can be used with <select> tags - however, you probably are looking for functionality where it would be best to use the onChange() event, not onClick().

Furthermore, by the look of your <c:...> tags, you are also trying to use JSP syntax in a plain HTML document. That's just... incorrect.

In response to your comment to this answer - I can barely understand it. However, it sounds like what you want to do is get the value of the <option> tag that the user has just selected whenever they select one. In that case, you want to have something like:

<html>
 <head>
  <script type="text/javascript">

   function changeFunc() {
    var selectBox = document.getElementById("selectBox");
    var selectedValue = selectBox.options[selectBox.selectedIndex].value;
    alert(selectedValue);
   }

  </script>
 </head>
 <body>
  <select id="selectBox" onchange="changeFunc();">
   <option value="1">Option #1</option>
   <option value="2">Option #2</option>
  </select>
 </body>
</html>

Adding an onclick function to go to url in JavaScript?

Try

 window.location = url;

Also use

 window.open(url);

if you want to open in a new window.

---

Related Topics