Div選擇下拉菜單jQuery的切換和選項

Question

我想讓我的下拉菜單在jQuery中工作，但由於某種原因.select div加載時保持與此腳本消失。

<div class="select">Select your option</div> 
<div class="dropdown"> 
    <ul> 
     <li>Option 1</li> 
     <li>Option 2</li> 
     <li>Option 3</li> 
     <li>Option 4</li> 
     <li>Option 5</li> 
    </ul> 
</div> 

而且我來到這裏這個腳本 -

<script> 
$(document).ready(function() { 
    $(".select").toggle(function() { 
     $(".dropdown").fadeIn("slow"); 
    }, 

    function() { 
     $(".dropdown").fadeOut("slow"); 
    }); 
}); 
</script> 

什麼我做錯了嗎？

此外 - 我想弄清楚如何根據他們點擊.dropdown的內容來改變.select的內容？或者什麼是最有效的方法？

Answer 1

使用.fadeToggle()

$(document).ready(function() { 
    $(".select").click(function() { 
     $(".dropdown").fadeToggle("slow"); 
    }); 
}); 

fiddle DEMO

讀

.toggle()Deprecated > Deprecated 1.8和1.9後取出店。所以你不能用1.10

Deprecated Selector

使用

Answer 2

你可以這樣做：

$(document).ready(function() { 
    $(".select").click(function() { 
     $(".dropdown").fadeToggle("slow"); 
    }); 

    $('.dropdown li').click(function() { 
     $(".select").text($(this).text()); 
    }); 
}); 

如，.toggle(function, function, ...)在jQuery 1.9 upgrade release

演示被刪除：Fiddle