Jquery Dropdownlist不显示所选项目。？_Jquery_Html_Css

Jquery Dropdownlist不显示所选项目。？

jquery html css

Jquery Dropdownlist不显示所选项目。？,jquery,html,css,Jquery,Html,Css,我有菜单 <nav> <ul id="menu"> <li> <a href="@Url.Action("Index", "Home")" title="Home">HOME</a></li> <li><a href="@Url.Action("Index","Project")" title="Project">PROJECTS</a><

我有菜单

 <nav>
    <ul id="menu">
        <li>  <a href="@Url.Action("Index", "Home")" title="Home">HOME</a></li>
        <li><a href="@Url.Action("Index","Project")" title="Project">PROJECTS</a></li>
        <li><a href="@Url.Action("Index","Event")" title="Event">EVENTS</a></li>
       ....
     </ul>
 </nav>

工作样本：

<!DOCTYPE html>
<html>
<head>
<script src="http://code.jquery.com/jquery-1.10.1.min.js"></script>
</head>
<body>
 <nav>
    <ul id="menu">
        <li><a href="Home" title="Home">HOME</a></li>
        <li><a href="Project" title="Project">PROJECTS</a></li>
        <li><a href="Event" title="Event">EVENTS</a></li>
     </ul>
 </nav>
  <script type="text/javascript">
 $(function () {
     $("a[title=Project]").addClass("active");

     $("<select />").appendTo("nav");
     // Create default option "Go to..."
     $("<option />", {
         "selected": "selected",
         "value": "",
         "text": "Go to..."
     }).appendTo("nav select");
     // Populate dropdown with menu items
     $("nav ul a").each(function () {
         var el = $(this)

         ,opt = {
             "value": el.attr("href"),
             "text": el.text()

         };
         if ( el.hasClass('active') ) {
            opt.selected = 'selected';
         }
         //console.log(el,el.hasClass('active'),opt);
         $("<option />", opt).appendTo("nav select");
     });
     //$("nav select").change(function (){
     $('nav').on('change', 'select',function() {
         window.location = $(this).val();
        // window.location = $(this).find("option:selected").val();
     });
     });

 </script>
</body>
</html>







$（函数（）{
$（“a[title=Project]”。addClass（“活动”）；
$（“”）。附于（“资产净值”）；
//创建默认选项“转到…”
$("", {
“已选定”：“已选定”，
“价值”：“，
“文本”：“转到…”
}).附录（“导航选择”）；
//用菜单项填充下拉列表
$（“nav ul a”）。每个（功能）{
var el=$（此）
，opt={
“值”：el.attr（“href”），
“文本”：el.text（）
};
if（el.hasClass（'active'））{
opt.selected='selected'；
}
//log（el，el.hasClass（'active'），opt）；
$（“”，opt）.appendTo（“导航选择”）；
});
//$（“导航选择”）。更改（功能（）{
$（'nav'）。在（'change'，'select'，function（）上{
window.location=$（this.val（）；
//window.location=$（this.find（“选项：选中”）.val（）；
});
});

nav select { display: none;}
#menu {......}
#menu li a {  color:#282826;  font-size:16px;  }
#menu li .active {    color:#3b619b;    padding-bottom:5px;border-bottom:4px solid #99a13f;    }

@media handheld, only screen and (max-width: 767px) {
  nav #menu     { display: none; }
nav select { display: inline-block; width:80%; margin-top:10px;margin-bottom:10px;margin-        left:20px;}
 }

<!DOCTYPE html>
<html>
<head>
<script src="http://code.jquery.com/jquery-1.10.1.min.js"></script>
</head>
<body>
 <nav>
    <ul id="menu">
        <li><a href="Home" title="Home">HOME</a></li>
        <li><a href="Project" title="Project">PROJECTS</a></li>
        <li><a href="Event" title="Event">EVENTS</a></li>
     </ul>
 </nav>
  <script type="text/javascript">
 $(function () {
     $("a[title=Project]").addClass("active");

     $("<select />").appendTo("nav");
     // Create default option "Go to..."
     $("<option />", {
         "selected": "selected",
         "value": "",
         "text": "Go to..."
     }).appendTo("nav select");
     // Populate dropdown with menu items
     $("nav ul a").each(function () {
         var el = $(this)

         ,opt = {
             "value": el.attr("href"),
             "text": el.text()

         };
         if ( el.hasClass('active') ) {
            opt.selected = 'selected';
         }
         //console.log(el,el.hasClass('active'),opt);
         $("<option />", opt).appendTo("nav select");
     });
     //$("nav select").change(function (){
     $('nav').on('change', 'select',function() {
         window.location = $(this).val();
        // window.location = $(this).find("option:selected").val();
     });
     });

 </script>
</body>
</html>