jQuery切換開關圖像

Question

我有一種情況，我不理解jQuery的切換。

我有兩個按鈕，它們都打開相同的內容，當你點擊任一按鈕時，內容應該打開或關閉，並且該屬性將按鈕從打開改爲關閉。 （所以兩個按鈕都具有相同的功能）。

唯一的一點是，當我點擊頂部按鈕並打開我的內容，然後單擊下部按鈕關閉它時，圖像屬性切換錯誤。

下面是我的代碼看起來像一個非常簡潔的版本，我將不勝感激一些幫助。之間的n

<script language="javascript" type="text/javascript"> 
    $(function() { 

     var open = false; 

     $("#button1, #button2").toggle(
      function() { 
       open = true; 
       $("#button1").attr("src", "images/btn-open.gif"); 
       $("#button2").attr("src", "images/btn-open.gif"); 
      }, 
      function() { 
       if (open) { 
        $("#button1").attr("src", "images/btn-closed.gif"); 
        $("#button2").attr("src", "images/btn-closed.gif"); 

       } else { 
        $("#button1").attr("src", "images/btn-open.gif"); 
        $("#button2").attr("src", "images/btn-open.gif"); 

       } 
       open = false; 

      } 
     ); 


    }); 
</script> 

<img id="button1" src="images/btn-open.gif"></img> 
<br /> 
<br /> 
<br /> 
<br /> 
<img id="button2" src="images/btn-open.gif"></img> 

Answer 1

.toggle()意志週期（通常爲2，但它並不限於2），設置在每個元素每次點擊功能，但你要一個兩個按鈕切換，不是每一個V2獨立切換，所以做了檢查，並使用.click()，像這樣：

var open = false; 
$("#button1, #button2").click(function() { 
    open = !open; //toggle it 
    $("#button1, #button2") //set the src based on the new state 
    .attr("src", "images/btn-" + (open ? "open" : "closed") + ".gif"); 
}); 

我也combined your selectors讓它有點整潔，這是相同的效果雖然:)我不是100％肯定，從您的圖片的名稱，以便您可能需要 切換布爾值，但你明白了。