Disable href with jquery/js

I am having difficulties in disabling href links through jquery. I am using this method I modified. Can some please advise or help me in figuring this out? Thank you.

jquery/js

<script>
 $('.next-tab').click(function() {
     $('.st_tab_active').attr('disabled','disabled');
     var tab=  $('.st_tab_active').parent().next().children('a');
     tab.removeAttr('disabled');
     tab.trigger('click');
     return false;
      });
</script>

html

<ul class="st_tabs">
    <li><a href="#st_content_1" class="st_tab" disabled="disabled">Horizontal Tab #1</a></li>
    <li><a href="#st_content_2" class="st_tab" disabled="disabled">Horizontal Tab #2</a></li>
    <li><a href="#st_content_3" class="st_tab" disabled="disabled">Horizontal Tab #3</a></li>
    <li><a href="#st_content_4" class="st_tab" disabled="disabled">Horizontal Tab #4</a></li>
    <li><a href="#st_content_5" class="st_tab" disabled="disabled">Horizontal Tab #5</a></li>
</ul>

Answer

You can use preventDefault(); to disable the default behaviour of links (which is, to navigate to the given href).

$("a").click(function(e){
    e.preventDefault(); 
});

Advertisement

Answer