jquery實(shí)現(xiàn)下拉框多選方法介紹
更新時(shí)間：2017年01月03日 09:14:09 作者：冷戰(zhàn)
本文是利用EasyUI實(shí)現(xiàn)下拉框多選功能，在ComboxTree其原有的基礎(chǔ)上對(duì)樣式進(jìn)行了改進(jìn)，樣式表已上傳demo，下面跟著小編一起來(lái)看下吧
一、說明
本文是利用EasyUI實(shí)現(xiàn)下拉框多選功能，在ComboxTree其原有的基礎(chǔ)上對(duì)樣式進(jìn)行了改進(jìn)，樣式表已上傳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實(shí)現(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
以上就是本文的全部?jī)?nèi)容，希望本文的內(nèi)容對(duì)大家的學(xué)習(xí)或者工作能帶來(lái)一定的幫助，同時(shí)也希望多多支持腳本之家！
相關(guān)文章
jQuery實(shí)現(xiàn) RadioButton做必選校驗(yàn)功能
這篇文章主要介紹了jQuery實(shí)現(xiàn) RadioButton做必選校驗(yàn)功能的相關(guān)資料,需要的朋友可以參考下2017-06-06
本篇文章主要是對(duì)Jquery解析json數(shù)據(jù)進(jìn)行了詳細(xì)的介紹，需要的朋友可以過來(lái)參考下，希望對(duì)大家有所幫助2013-12-12
很簡(jiǎn)單的一個(gè)效果插件,但不是經(jīng)常用,怕忘了,以后在用又要去看文檔,所以現(xiàn)在把筆記寫下來(lái),方便以后2010-08-08
這篇文章主要為大家詳細(xì)介紹了jQuery實(shí)現(xiàn)增刪改查，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2020-12-12
8款非常棒的響應(yīng)式j(luò)Query 幻燈片插件推薦
這篇文章收集了8款優(yōu)秀的響應(yīng)式 jQuery 幻燈片插件，它們能夠非常容易的集成到 Web 項(xiàng)目中。響應(yīng)式（Responsive）設(shè)計(jì)的目標(biāo)是要讓產(chǎn)品界面能夠響應(yīng)用戶的行為，根據(jù)不同終端設(shè)備自動(dòng)調(diào)整尺寸，帶給用戶良好的使用體驗(yàn)2012-02-02
這篇文章主要介紹了jQuery中trigger()與bind()用法,結(jié)合實(shí)例形式分析了trigger()與bind()的功能、定義及具體使用技巧,需要的朋友可以參考下2015-12-12
通過Jquery.cookie.js實(shí)現(xiàn)展示瀏覽網(wǎng)頁(yè)的歷史記錄超管用
本文給大家分享利用cookie插件獲取用戶瀏覽文章或者是網(wǎng)頁(yè)的歷史記錄，并把用戶最近瀏覽過的信息顯示在頁(yè)面，涉及到 jquery.cookie.js相關(guān)知識(shí)，感興趣的朋友可以參考下2015-10-10
這篇文章主要介紹了基于jQuery日歷插件制作日歷的相關(guān)資料,需要的朋友可以參考下2016-03-03
這篇文章主要介紹了jQuery中實(shí)現(xiàn)text()的方法,非常不錯(cuò)，具有一定的參考借鑒價(jià)值，需要的朋友可以參考下2019-04-04
Lazy Load是一個(gè)用 JavaScript 編寫的jQuery插件. 它可以延遲加載長(zhǎng)頁(yè)面中的圖片. 本文對(duì)它進(jìn)行實(shí)例介紹，具有很好的參考價(jià)值，下面跟著小編一起來(lái)看下吧2016-12-12