slideDown（）在jquery

Question

我想要一個簡單的上下滑動效果。我是新來的jQuery，我試圖屆下面的代碼，但它不工作

<script> 
$(document).ready(function() { 
    $('#fade li:first-child').css('display','none'); 
    $('#fade li:second-child').click(function() { 
     $('#fade li:first-child').slideDown();   
    }) 
}) 
</script> 

的Html

<ul id="fade"> 
    <li>one</li> 
    <li>two</li> 
    <li>three</li> 
</ul> 

請幫幫忙，謝謝

Answer 1

試試這個代碼

$(document).ready(function(){ 

     $('#fade li:first-child').css('display','none'); 

     $('#fade li').click(function(){ 


      $('#fade li:first-child').slideDown(); 

      }) 
     }) 

Answer 2

錯誤在這行：

$('#fade li:second-child') 

用途：nth-​​child（2）選擇器獲取2元素或$（'＃fade li'）。eq（1）

<script> 
$(document).ready(function(){ 

    $('#fade li:first-child').css('display','none'); 

    $('#fade li:nth-child(2)').click(function(){ 

     $('#fade li:first-child').slideDown(); 

     }) 
    }) 
</script> 

Answer 3

給這個一展身手：

$(document).ready(function(){ 
    var mySlider = function(toggle, obj) 
    { 
    toggle.click(function(e){ 
     if(!obj.is(':visible')) 
     { 
      obj.slideDown(); 
     } 
     else 
     { 
      obj.slideUp(); 
     } 
    }); 
    } 

    var slide_toggle = $('#fade li:nth-child(2)'); 
    var menu = $('#fade li:first-child'); 
    menu.css('display', 'none'); 

    mySlider(slide_toggle, menu); 
}); 

Answer 4

是否缺少<script type='text/javascript'>我沒發現什麼你的代碼錯誤。