jquery實現(xiàn)下拉框多選方法介紹
更新時間：2017年01月03日 09:14:09 作者：冷戰(zhàn)
本文是利用EasyUI實現(xiàn)下拉框多選功能，在ComboxTree其原有的基礎上對樣式進行了改進，樣式表已上傳demo，下面跟著小編一起來看下吧
一、說明
本文是利用EasyUI實現(xiàn)下拉框多選功能，在ComboxTree其原有的基礎上對樣式進行了改進，樣式表已上傳demo，代碼如下
二、代碼
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>利用EasyUI實現(xiàn)多選下拉框</title>
<link rel="stylesheet" type="text/css" href="EasyUI/easyui.css" />
<script type="text/javascript" src="EasyUI/jquery.min.js"></script>
<script type="text/javascript" src="EasyUI/jquery.easyui.min.js"></script>
<script type="text/javascript">
$(function () {
$('#ddlLine').combotree({
valueField: "id", //Value字段
textField: "text", //Text字段
multiple: true,
data: [{ "id": 1, "text": "All", "children": [{ "id": 13, "text": "C1" }, { "id": 14, "text": "C2" }, { "id": 15, "text": "C3"}]}],
// url: "tree_data2.json", //數(shù)據(jù)源
onCheck: function (node, checked) {
//讓全選不顯示
$("#ddlLine").combotree("setText", $("#ddlLine").combobox("getText").toString().replace("全選,", ""));
},
onClick: function (node, checked) {
//讓全選不顯示
$("#ddlLine").combotree("setText", $("#ddlLine").combobox("getText").toString().replace("全選,", ""));
}
});
})
</script>
</head>
<body>
多選：<select id="ddlLine" class="easyui-combotree" style="width: 205px; height: 24px;">
</select>
</body>
</html>
三、效果
四、下載
案例下載：http://wd.jb51.net:81//201701/yuanma/ComboBox_jb51.rar
以上就是本文的全部內(nèi)容，希望本文的內(nèi)容對大家的學習或者工作能帶來一定的幫助，同時也希望多多支持腳本之家！
相關文章
jQuery Trim去除字符串首尾空字符的實現(xiàn)方法說明
本篇文章主要是對jQuery Trim去除字符串首尾空字符的實現(xiàn)方法進行了詳細的介紹，需要的朋友可以過來參考下，希望對大家有所幫助2014-02-02
這篇文章主要介紹了Jquery 實現(xiàn)table樣式的設定方法的相關資料,需要的朋友可以參考下2015-01-01
在實踐中還是遇到了很多的問題，注意在input的checkbox中，用普通的attr屬性來判斷是不可以的，因為checked的值是checked，因此做個筆記2013-11-11
這篇文章主要介紹了使用jQuery操作HTML的table表格的實例解析,包括用jQuery獲取表格總行數(shù)的小技巧,需要的朋友可以參考下2016-03-03
本文主要總結(jié)了jQuery中的一些小技巧。具有一定的參考價值，下面跟著小編一起來看下吧2017-01-01
3種不同的ContextMenu右鍵菜單實現(xiàn)代碼
本文給大家分享3種不同的ContextMenu右鍵菜單實現(xiàn)代碼的相關資料,非常不錯，具有一定的參考借鑒價值，需要的朋友可以參考下2016-11-11
最近用jQuery來寫下拉框的選項值的左右移動，放到jsp里面就不能用了，經(jīng)過測試終于找到了解決方法在此與大家分享下2013-08-08
jquery實現(xiàn)的回旋滾動效果完整實例【附demo源碼下載】
這篇文章主要介紹了jquery實現(xiàn)的回旋滾動效果,可實現(xiàn)點擊后側(cè)圖片呈現(xiàn)立體翻轉(zhuǎn)切換的功能,涉及jQuery插件roundabout.js的使用,并附帶了完整實例demo源碼供讀者下載參考,需要的朋友可以參考下2016-09-09
jQuery實現(xiàn)仿QQ空間裝扮預覽圖片的鼠標提示效果代碼
這篇文章主要介紹了jQuery實現(xiàn)仿QQ空間裝扮預覽圖片的鼠標提示效果代碼,基于jQuery鼠標事件動態(tài)操作頁面元素樣式的動態(tài)變換實現(xiàn)該功能,需要的朋友可以參考下2015-10-10
下面小編就為大家?guī)硪黄褂胘Query和ajax代替iframe的方法(詳解)。小編覺得挺不錯的，現(xiàn)在就分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2017-04-04