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