disabling tab user click

[devnull]

I am selecting the tabs from another object and need to disable the tab click event so that the user can not change tabs by clicking on them, but the other object that controls the tabs can still work.

I have tried to unbind the tab's click even but that does not work:

Code:

$('.tabs-inner').unbind();

How can I disable the click event whilst still allowing the tabs to be selected programatically ?

[jarry]

Please call 'disableTab' method to disable a special tab panel. When a tab panel is disabled, users can not click to select it but this tab panel still can be selected by calling 'select' method.

Code:

var t = $('#tt');  // the tabs object
t.tabs('disableTab', index);  // disable the special tab panel
t.tabs('select', index);  // select this tab panel again

[devnull]

Thanks, but I have already tried that, the tab get greyed out, I will want it to appear to look normal and not look like it is disabled.

How can I unbind the click event from the tab, as this will solve the problem without having to hack the CSS.

[jarry]

Please add the style below to the page to prevent from greying the tab title.

Code:

<style>
.tabs-disabled{
  opacity:1.0;
}
</style>

If you do not want the user to select all the tabs, you can hide the tabs header.

Code:

$('#tt').tabs({
  showHeader:false
});