jQuery - removeClass工作不正常

Question

我不知道如何更改代碼，removeClass函數可以完成他的工作。目前，這個功能不起作用（我認爲是這樣）。最大的問題是這樣的：

當我點擊菜單項「1」時，出現黑框，菜單項「1」文字顏色變藍。假設當我點擊菜單項「2」時，比第一個菜單項「1」變爲黑色（不是藍色），第二個菜單項「2」變爲藍色是合乎邏輯的。但是，他們都是藍調。

小的代碼部分：

$(document).ready(function() { 
$('#icons').click(function() { 
    $('#chat-drop,#chat-drop2').hide() 
     if ($('#chat-drop').is(":visible")) { 
      $('#chat-drop').hide() 
     $('#rodyti').removeClass('active'); 
     } else { 
      $('#chat-drop').show() 
     $('#rodyti').addClass('active'); 
     } 
    return false; 
}); 

全碼：http://jsfiddle.net/wW75v/9/

我將不勝感激任何幫助

Answer 1

你的問題似乎是，你正在做的removeClass（）的時候＃ chat-drop是（「：visible」），但如果因爲你剛剛在前一行隱藏了＃chat-drop，它就不會進入。

您可以將removeClass（）添加到rodyti和rodyti2中，以便始終刪除它們。但要注意，如果你觸發hide（）的上方，那麼is（「：visible」）是無用的。

Answer 2

只是一個建議，而不是使用id，你可以使用class。它會降低你的代碼，如：

FROM

<div id="icons"> 
    <div id="rodyti">1</div> 
    <div id="chat-drop">Menu1</div> 
</div> 
<div id="icons2"> 
    <div id="rodyti2">2</div> 
    <div id="chat-drop2">Menu2</div> 
</div> 

TO：

<div class="icons"> 
    <div class="rodyti">1</div> 
    <div class="chat-drop">Menu1</div> 
</div> 
<div class="icons"> 
    <div class="rodyti">2</div> 
    <div class="chat-drop">Menu2</div> 
</div> 

JS代碼

$('#icons').click(function() { 
    $('#chat-drop,#chat-drop2').hide() 
    // Your code here.. 
    return false; 
}); 


$('#icons2').click(function() { 
    $('#chat-drop,#chat-drop2').hide() 
    // Your code here.. 
    return false; 
}); 

僅此於

$('.icons').click(function() { 
    $('.chat-drop').hide() 
    // Your code here.. 
    return false; 
});