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％肯定，从您的图片的名称，以便您可能需要 切换布尔值，但你明白了。