Prevent anchor behaviour

When I want to prevent defau开发者_运维问答lt behaviour of anchor tag I`m using

<a href="javascript:void(0);">link</a>

Which is the most effective solution ?

An example of a gracefully degrading solution:

<a href="no-script.html" id="myLink">link</a>

<script>
document.getElementById("myLink").onclick = function() {
    // do things, and then
    return false;
};
</script>

Demo: http://jsfiddle.net/karim79/PkgWL/1/

This is a nice approach, if you're using jquery you can also do:

<a id="link" href="javascript:void(0)">link</a>

<script type="text/javascript">
   $("#link").click(function(ev) {
       ev.preventDefault();
   });
</script>

preventDefault can be useful also to prevent submitting form

You can also have this:

<a href="#" onclick="return false;">link</a>

If you never want for the browser to follow the link anywhere, I'd say what you've got is the simplest, safest solution.

Sure, there are heaps of other solutions you could apply with javascript, but most other ways may fail when

• The DOM is not completely loaded, if the event is assigned at DOMReady or later, which is common.
• A click event listener handles the link (which is common where you want links not to be followed by the browser). If an error occurs in the javascript that handles the click, the return false; or preventDefault that might be at the end of the statement, will not be executed, and the browser will follow the link, if only to #.

I know it's an old thread but here is what I use often

Instead of this:

<a href="javascript:void(0);">link</a>

This also can work:

<a href="javascript:;">link</a>

Here is very easy way to stop this.

( function( $ ) {
   $( 'a[href="#"]' ).click( function(e) {
      e.preventDefault();
   } );
} )( jQuery );