jQuery的切換（）不工作

HTML：

<div id="cta-end"><h1>Modification</h1></div> 
<div id="bloc1"></div> 
<div id="bloc2"></div>

CSS：

#cta-end 
{ 
    width:100%; 
    background-color:red; 
    text-align:center; 
} 

#cta-end:hover 
{ 
    cursor:pointer; 
} 

#bloc1, #bloc2 
{ 
    width: 100%; 
    height: 50px; 
    margin: 5px 0; 
    display:none; 
} 

#bloc1{ 
    background-color:blue; 
} 
#bloc2{ 
    background-color:grey; 
}

和jQuery：

$(document).ready(function(){ 


    $('#cta-end').click(function(){ 
      $('#cta-end').toggle(function() { 
       $('#bloc1').css({"display":"block"}); 
       $('#bloc2').css({"display":"block"}); 
      }, 
       function() { 
        $('#bloc1').css({"display":"none"}); 
        $('#bloc2').css({"display":"none"}); 
       } 
       ); 
     }); 

    });

我試圖做的是，當點擊，顯示兩個div bloc1和bloc2，當我點擊另一個時間cta-end時，它不顯示任何內容。我的代碼根本不起作用。我想我沒有使用它應該使用的toggle()函數。我只是想切換兩個功能中的任何時間cta-end點擊..

這裏是jsfiddle

感謝你的代碼！

來源

2013-04-26 Estelle Chvl

可以使用下面的代碼的可見性：

$(document).ready(function() { 
    $('#cta-end').click(function() { 
     $('#bloc1, #bloc2').toggle(); 
     //or $('#bloc1, #bloc2').toggle(1000); for transition effect 
    }); 
});

JSFIDDLE1或JSFIDDLE2

來源

2013-04-26 10:45:25 arulmr

謝謝你..該解決方案是簡單的！ – 2013-04-26 10:56:40

嘗試了這一點，FIDDLE

$(document).ready(function(){ 
     $('#cta-end').toggle(function() { 
      $('#bloc1').css({"display":"block"}); 
      $('#bloc2').css({"display":"block"}); 
     }, 
      function() { 
      $('#bloc1').css({"display":"none"}); 
      $('#bloc2').css({"display":"none"}); 
     } 
    );

}）;

嘗試使用這樣

 $('#bloc1,#bloc2').css({"display":"block"});

EDITED 的jQuery 1.9

$(document).ready(function(){ 

    $('#cta-end').click(function(){ 
     $('#bloc1').toggle('fast'); 
     $('#bloc2').toggle('fast'); 
    }); 

});

來源

2013-04-26 10:40:59

它不使用jQuery 1.9工作:( – 2013-04-26 10:46:01

檢查了這一點http://jsfiddle.net/rajesh007/GB5tf/2/ – 2013-04-26 10:56:28

嘗試，下面的代碼。