JQuery Tab - Make Selected tab clickable

I basically need the current selected tab to remain clickable (meaning the link should still be active).

The content in the tab is loaded through ajax and can change, so the way the person can "refresh" the conten开发者_开发百科t it by clicking the tab again. But the default settings make the tab not clickable once it's selected, which makes the user have to click on another tab then back to refresh the content.

I appreciate any help, thanks.

The tabs plugin will fire a 'tabsselect' Event when a tab is clicked. Register a callback, whose second parameter will have a 'tab' property where you can check which tab you're on:

jQuery('#tabs-container').bind('tabsselect', function(e, tabsContainer) {

   jQuery(tabsContainer.tab).attr('href'));
});

EDITIED:

It will only fire when the tab actually changes. Maybe bind on the anchor element within the tabs structure, and check for the ui-tabs-selected class. There's decent documentation on the tabs plugin: http://docs.jquery.com/UI/Tabs .

Roughly:

jQuery('#tabs-container a').bind('click', function() {
    if(jQuery(e.target).hasClass('ui-tabs-selected')) {
        // do some stuff
    }
});

Define onclick event of anchor to tab to reload or send to the parent page, like this

<div id="divTab">
  <ul>
    <li><a href="#tab_1">First Tab</a></li>
    <li><a href="#tab_2" style="cursor:pointer;" onclick="window.location.reload();">Second Tab</a>
    </li>
    <li><a href="#tab_3" style="cursor:pointer;" onclick="window.location.replace('url');">Third Tab</a>
    </li>
  </ul>
</div>