jQuery optgroup是一種能夠讓你在select框中創建多層嵌套的下拉列表的功能。
<select id="select1">
<optgroup label="組1">
<option value="1.1">選項1.1</option>
<option value="1.2">選項1.2</option>
</optgroup>
<optgroup label="組2">
<option value="2.1">選項2.1</option>
<option value="2.2">選項2.2</option>
</optgroup>
</select>
在上面的代碼中,我們創建了一個包含兩個optgroup的select框。將label屬性用于optgroup標簽,可以為每個optgroup添加組名。每個選項都使用option標簽來創建,value屬性用于聲明選項的值,同時option標簽中的文本將顯示給用戶。
如果你需要通過jQuery來為select框添加optgroup,那么可以使用以下代碼:
$("#select2").append($("<optgroup>").attr("label", "組1")
.append($("<option>").val("1.1").text("選項1.1"))
.append($("<option>").val("1.2").text("選項1.2"))
);
$("#select2").append($("<optgroup>").attr("label", "組2")
.append($("<option>").val("2.1").text("選項2.1"))
.append($("<option>").val("2.2").text("選項2.2"))
);
在這個代碼片段中,我們用jQuery的append函數來添加optgroup和option標簽。attr函數用于將label屬性添加到optgroup標簽中,同時每個option標簽都是使用append函數來添加到optgroup中的。
jquery optgroup是一個十分有用的功能,特別是在大規模數據結構中需要顯示的時候。