JQuery Chosen是一款非常流行的下拉框插件,它允許用戶從給定的選項中進行單選或多選。當需要從一個大列表中選擇很多選項時,它非常有用,因為它可以允許用戶快速定位和選擇選項。
在Chosen中實現多選非常簡單。只需要在你的select元素中指定multiple屬性,Chosen就會自動將其渲染成一個多選下拉框。
<select multiple class="chosen"> <option value="option1">選項1</option> <option value="option2">選項2</option> <option value="option3">選項3</option> </select>
當多選下拉框被呈現為用戶界面時,用戶可以通過點擊選項來進行選擇。選項的選定狀態會被高亮顯示。然后,當用戶提交表單時,所選的選項都將被作為表單數據提交。
在某些情況下,你可能想要對Chosen多選控件進行進一步的定制。你可以使用Chosen的API來完成這個工作。例如,下面的代碼演示如何將選項的文本串聯起來,并將其置于一個隱藏的input元素中。
$('select.chosen').chosen().change(function() { var selected = ""; $(this).find("option:selected").each(function() { selected += $(this).text() + ","; }); selected = selected.slice(0, -1); $(this).parent().find("input:hidden").val(selected); });
這段代碼會在多選控件的選擇事件中被調用。當選擇發生變化時,它會遍歷所有選中的選項,并將它們的文本串聯到一個字符串中。然后,它將該字符串南草一個隱藏的input元素中。這樣就可以通過表單提交和處理來獲取和操作該字符串。
上一篇半橢圓用css怎么做
下一篇mysql一直報主鍵沖突