如何使用選擇選項，以使多層次的下拉菜單mentod

我想用select和option方法如何使用選擇選項，以使多層次的下拉菜單mentod

<select> 
    <option value="" data-display-text="Select">None</option> 
    <option value="oranges">SSC</option> 
    <option value="oranges">GATE</option> 
    <option value="bananas">BANK PO</option> 
    <option value="bananas">RAILWAY</option> 
</select>

來源

2017-06-05 babu harry

你試圖創建某種導航，或者你是否試圖在表單中使用「this」？ –

只是想讓選擇下拉 –

你不能讓與select元多層次，使多層次的下拉菜單。

在這種情況下，您將創建一個自定義組件，並具有顯示類似「層次」的功能。

或者使用這樣的伎倆：如果要用一個

<select> 
 
    <option>select me</option> 
 
    <option>&nbsp;me indented</option> 
 
    <option>&nbsp;&nbsp;even more indentation</option> 
 
</select>

來源

2017-06-05 10:58:08 john

感謝您的時間約翰 –

選擇，你可以使用<optgroup/>。看例子。注意：它不是非常多層次的，但它允許某種相關的分組。

<select> 
 
    <option value="" selected="selected">Select an option...</option> 
 
    <optgroup label="SSC"> 
 
    <option value="oranges1">some option</option> 
 
    <option value="oranges2">some option</option> 
 
    <option value="oranges3">some option</option> 
 
    </optgroup> 
 
    <optgroup label="GATE"> 
 
    <option value="bananas1">some option</option> 
 
    <option value="bananas2">some option</option> 
 
    <option value="bananas3">some option</option> 
 
    </optgroup> 
 
    <optgroup label="BANK PO"> 
 
    <option value="apples1">some option</option> 
 
    <option value="apples2">some option</option> 
 
    <option value="apples3">some option</option> 
 
    </optgroup> 
 
    <optgroup label="RAILWAY"> 
 
    <option value="grapes1">some option</option> 
 
    <option value="grapes2">some option</option> 
 
    <option value="grapes3">some option</option> 
 
    </optgroup> 
 
</select>

來源

2017-06-05 11:02:34

如此之快，是啊我得到它，我們可以使小標題部分隱藏像前：ssc，鐵路，並讓他們顯示onclick –

因爲選擇/選項/ optgroup是或多或少不可風格我甚至不會考慮使用select來打算使用它。我會使用vanillajs作爲演示文稿的邏輯和適用的HTML/CSS。如果您從數據的呈現開始（應該看起來如何），您會發現在點擊特定元素時「執行」的內容非常容易。 –

你不能讓與選擇元件多個級別。

任何方式，如果它的任何幫助，有

<select> 
    <optgroup label="Swedish Cars"> 
    <option value="volvo">Volvo</option> 
    <option value="saab">Saab</option> 
    </optgroup> 
    <optgroup label="German Cars"> 
    <option value="mercedes">Mercedes</option> 
    <option value="audi">Audi</option> 
    </optgroup> 
</select>

來源

2017-06-05 11:03:07 Ben

是的，謝謝，我明白了 –

據我理解你的「多級下拉」的概念可以進行簡單的下拉列表，並僅僅通過CSS還可以將一些元素。 Cathegory名稱存儲在optogroup中。

<select name="select_projects" id="select_projects"> 
     <option value="">project.xml</option> 
     <optgroup label="client1"> 
      <option value="">project2.xml</option> 
     </optgroup> 
     <optgroup label="client2"> 
      <option value="">project5.xml</option> 
      <option value="">project6.xml</option> 
      <optgroup label="client2_a"> 
       <option value="" style="margin-left:23px;">project7.xml</option> 
       <option value="" style="margin-left:23px;">project8.xml</option> 
      </optgroup> 
      <option value="">project3.xml</option> 
      <option value="">project4.xml</option> 
     </optgroup> 
     <option value="">project0.xml</option> 
     <option value="">project1.xml</option> 
    </select>

更新時間：
或者，如果你想做一個下拉菜單中的「鏈」就像你在Windows開始菜單中有，那就是做最簡單的方法：
https://jqueryui.com/menu/

來源

2017-06-05 11:04:50

如何使用選擇選項，以使多層次的下拉菜單mentod

回答

相關問題