选择框不在jquery菜单中

时间:2016-01-13 13:10:58

标签: javascript jquery html css jquery-ui

请检查此小提琴链接,为什么选择下拉列表中的框不起作用

jsfiddle

我正在使用此https://jqueryui.com/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>
&#13;
{{1}}
&#13;
&#13;
&#13;

1 个答案:

答案 0 :(得分:0)

创建另一个子菜单(而不是选择)并用css控制溢出。这样,您就可以在一个狭小的空间中包含数百个国家/地区值。

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


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