選擇框在jQuery菜單中不起作用

Question

請檢查此小提琴鏈接，為什么下拉列表中的選擇框不起作用

jsfiddle

我正在使用此https://jqueryui.com/menu/，但我的選擇框不起作用。

 $(function() { $("#left_menu").menu(); }); 

 ul ,li{ width:100px; } 

  <link rel="stylesheet" href="//code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css"> <script src="//code.jquery.com/jquery-1.10.2.js"></script> <script src="//code.jquery.com/ui/1.11.4/jquery-ui.js"></script> <ul id="left_menu"> <li><a href="#">Passport(s)</a><ul><li> <label for="passport_select">Select Experience</label> <select name="passport_select" id="passport_select"> <option>Conotou</option> <option>BOSSMAN A</option> <option>BOSSMAN B</option> <option>Import</option> </select> <button class="filter_link" id="passport">SUBMIT</button> <br> </li></ul></li> <li><a href="#">gender</a> <ul> <li class="filter_link" id="gender"> <input type="radio" name="sex" value="male" checked> Male <br> <input type="radio" name="sex" value="female"> Female </li> </ul> </li> </ul> 

Answer 1

進行另一個子菜單（而不是選擇），並使用CSS控制溢出。 這樣，您可以在一個很小的空間中包含數百個國家/地區值。

<li>
    <div class="CountryWrapper">
        <ul>
          <li>BOSSMANA</li>
          <li>BOSSMANB</li>
        </ul>
    </div>
</li>


       .CountryWrapper{          
          overflow-x: scroll;
          height: 200px;
        }