How to prevent default event handling in an onclick method

Question

How to prevent default in an onclick method  I have a method in which I am also passing a custom value   lt a href     onclick  callmymethod 24   gt Call lt  a gt      function callmymethod myVal         doing custom things with myVal       here I want to prevent default

User · Answer

If you need to put it in the tag  Not the finest solution  but it will work   Make sure you put the onclick event in front of the href  Only worked for my this way    lt a onclick  return false   href    www google de  gt Google lt  a gt

User · Answer

Just place  javascript void 0    in place of     in href tag   lt a href  javascript void 0    onclick  callmymethod 24   gt Call lt  a gt

User · Answer

In my opinion the answer is wrong  He asked for event preventDefault    when you simply return false  it calls event preventDefault    AND event stopPropagation    as well   You can solve it by this    lt a href     onclick  callmymethod event  24   gt Call lt  a gt      function callmymethod e  myVal         doing custom things with myVal        here I want to prevent default     e   e    window event      e preventDefault

User · Answer

You can use   event stopPropagation     https   dom spec whatwg org  dom-event-stoppropagation

User · Answer

Let your callback return false and pass that on to the onclick handler    lt a href     onclick  return callmymethod 24   gt Call lt  a gt   function callmymethod myVal         doing custom things with myVal       here I want to prevent default     return false        To create maintainable code  however  you should abstain from using  inline Javascript   i e   code that s directly within an element s tag  and modify an element s behavior via an included Javascript source file  it s called unobtrusive Javascript    The mark-up    lt a href     id  myAnchor  gt Call lt  a gt    The code  separate file       Code example using Prototype JS API    myAnchor   observe  click   function event        Event stop event      suppress default click behavior  cancel the event        your onclick code goes here

User · Answer

Try this  but please use buttons for such cases if you don t have a valid href value for graceful degradation   lt a href  quot   quot  onclick  quot callmymethod 24   return false  quot  gt Call lt  a gt

User · Answer

It would be too tedious to alter function usages in all html pages to return false   So here is a tested solution that patches only the function itself   function callmymethod myVal           doing custom things with myVal         cancel default event action     var event   window event    callmymethod caller arguments 0       event preventDefault   event preventDefault      event returnValue   false        return false          This correctly prevents IE6  IE11 and latest Chrome from visiting href     after onclick event handler completes   Credits    How do you find out the caller function in JavaScript  event preventDefault   function not working in IE

User · Answer

This worked for me   lt a href  javascript    onclick  callmymethod 24   return false   gt Call lt  a gt

User · Answer

Another way to do that is to use the event object inside the attribute onclick  without the need to add an additional argument to the function to pass the event    x000D   x000D  function callmymethod myVal   x000D      console log myVal   x000D    x000D   lt a href   link  onclick  event preventDefault   callmymethod 24   gt Call lt  a gt  x000D   x000D   x000D

User · Answer

Give a class or id to the element and use jquery function unbind         slide prevent   click function                        slide prevent   unbind

User · Answer

You can catch the event and then block it with preventDefault   -- works with pure Javascript  document getElementById  xyz   addEventListener  click   function event       event preventDefault        console log this getAttribute  href            Do some other things

[javascript] How to prevent default event handling in an onclick method?

Examples related to javascript