jQueryUI Tabs show() on specific tab?

I've been checking everything, but cant seem to find how to make the show() event only react on a specific tab?

I have the following tab:

<div id='tabs' class='ui-tabs'>
  <ul class='ui-tabs-nav'>
    <li><开发者_C百科;a href='#tabs-1'>tab 1</a></li>
    <li><a href='#tabs-2'>tab 2</a></li>
    <li><a href='#tabs-3'>tab 3</a></li>
  </ul>

  <div id='tabs-1'></div>
  <div id='tabs-2'></div>
  <div id='tabs-3'></div>
</div>

And i want the show() event only to react on showing id 1. Is it possible? :)

My JS are:

$(function() { 
  $('#tabs').tabs({
    cookie: {expires: 1}, 
    show: function(event, ui) {
      $('#campaigns-attached').delegate('li', 'dblclick', function() { $('#campaigns-non-attached').append(this); var id = this.getAttribute('id'); campaignsAttachRemove(id); });
      $('#campaigns-non-attached').delegate('li', 'dblclick', function() { $('#campaigns-attached').append(this); var id = this.getAttribute('id'); campaignsAttachThis(id); });
      $('#users-attached').delegate('li', 'dblclick', function() { $('#users-non-attached').append(this); var id = this.getAttribute('id'); usersAttachRemove(id); });
      $('#users-non-attached').delegate('li', 'dblclick', function() { $('#users-attached').append(this); var id = this.getAttribute('id'); usersAttachThis(id); });
    }
  }).disableSelection();
});

The usersAttachThis() and usersAttachRemove() are AJAX callback functions. So if i change tab and then go back to the tab where i need the delegate() function, it will react 3 times.

So i need to say something like

if (tabSelected == "tabs-1") {
  $('#users-attached').delegate('li', 'dblclick', function() { $('#users-non-attached').append(this); var id = this.getAttribute('id'); usersAttachRemove(id); });
  $('#users-non-attached').delegate('li', 'dblclick', function() { $('#users-attached').append(this); var id = this.getAttribute('id'); usersAttachThis(id); });
}

OR, find another to do this, instead of delegate()?

If it were possible, and I'm pretty sure it's not, it would invalidate the consistency of the component. Instead why don't you have the "show" event call a function in your script like "fauxShow" and in "fauxShow" check if tab with id="1" was selected and then call function "realShow".

There are dozens of ways to do that, but it might help to get a better answer if you could explain why you only want the event raised on the one tab and not the others.

$(function() { 
  $('#tabs').tabs({
    cookie: {expires: 1}, 
    show: function(event, ui) {
      $('#campaigns-attached').undelegate('li', 'dblclick');
      $('#campaigns-attached').delegate('li', 'dblclick', function() { $('#campaigns-non-attached').append(this); var id = this.getAttribute('id'); campaignsAttachRemove(id); });
      $('#campaigns-non-attached').undelegate('li', 'dblclick');
      $('#campaigns-non-attached').delegate('li', 'dblclick', function() { $('#campaigns-attached').append(this); var id = this.getAttribute('id'); campaignsAttachThis(id); });
      $('#users-attached').undelegate('li', 'dblclick');
      $('#users-attached').delegate('li', 'dblclick', function() { $('#users-non-attached').append(this); var id = this.getAttribute('id'); usersAttachRemove(id); });
      $('#users-non-attached').undelegate('li', 'dblclick');
      $('#users-non-attached').delegate('li', 'dblclick', function() { $('#users-attached').append(this); var id = this.getAttribute('id'); usersAttachThis(id); });
    }
  }).disableSelection();
});

I found the answer :) Just use the undelegate() option before using the delegate() option. Then it won't fire twice.