CODEWITHSUNDEEP
javascriptjquery
Musaddiq Khan
Musaddiq Khan

Reputation: 1937

How do I prevent default tab switching functionality in JQuery?

I have created the tabs below.

<ul class="idTabs">
<li><a href="#basic_info" id="basic_info_link" >Personal</a></li>
<li><a href="#add_info" id="add_info_link">Address</a></li>
<li style="width:194px;"><a href="#payment_info" id="payment_link" style="border-left:none;width:194px;">Bank</a></li>
</ul>
<div id="basic_info"><!--HTML Code --></div>
<div id="add_info"><!--HTML Code --></div>
<div id="payment_info"><!--HTML Code --></div>

The tabs work fine, but the problem is that on clicking these tabs heading I want to prevent to go to next tab.

Upvotes: 0

Views: 3346

Answers (1)

thecodeparadox
thecodeparadox

Reputation: 87073

$('.idTabs li a').on('click', function(e) {

   e.preventDefault();

});

DEMO

Upvotes: 3

Related Questions