jQueryUI選項卡顯示（）在特定的選項卡上？

Question

我一直在檢查一切，但似乎無法找到如何使show（）事件只對特定選項卡作出反應？

我有以下標籤：

<div id='tabs' class='ui-tabs'> 
    <ul class='ui-tabs-nav'> 
    <li><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> 

，我想秀（）事件只對顯示是否有可能ID 1. 反應？ :)

我的JS是：

$(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(); 
}); 

的usersAttachThis（）和usersAttachRemove（）是AJAX回調函數。 所以，如果我改變標籤，然後回到我需要委託（）函數的選項卡，它會反應3次。

所以我要這樣說

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，找到另一個要做到這一點，而不是委託（）？

Answer 1

$(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(); 
}); 

我找到了答案:) 只需使用undelegate（）選項使用委託（）選項之前。然後它不會發射兩次。

Answer 2

如果有可能，並且我確信它不是，它會使組件的一致性失效。相反，爲什麼你沒有「show」事件在你的腳本中調用一個函數，比如「fauxShow」和「fauxShow」，檢查是否選擇了id =「1」的選項卡，然後調用函數「realShow」。

有幾十種方法可以做到這一點，但如果您能解釋爲什麼您只想在一個選項卡上提出事件而不是其他選項，則可能會有更好的答案。