Alternative to when the anchor tag only triggers a jQuery action without redirecting the user?

Question

I have numerous anchor tags on my page that only trigger jQuery actions on the same page.

The don\'t redirect the user to another location, which is the normal expected

Answer 1

if you bind some action on click on you can call preventDefault() to avoid sending user in top of page

$("a.clickable").live('click',function(){$(this).doSome(); $(this).preventDefault()});

Answer 2

return false;

Use this to stop browser sending them to top of page?

Answer 3

I use below code and that works fine.

<div class="panel-heading">Definition
          <div class="pull-right">
              <i class="fa fa-wrench"></i> 
                 <a id="step3Ad" href="javascript:void(0);">Advanced</a>
          </div>
    </div

Answer 4

If you have links that aren't links, perhaps they shouldn't be links? :-) You might consider a different UI element that doesn't have a default behavior (outside of a form), like button (you can style buttons to a substantial degree). Or you could use span or similar, but if you do be sure to set the appropriate accessibility information (such as an ARIA role="link") so that you don't mess up screen readers (and browser tabbing).

But if you want to continue to use <a href="#">...</a>, just attach a handler to them that calls event.preventDefault(); or returns false.