首页>>表单>>分组select选择器，支持多选和单选(2025-03-17)

分组select选择器，支持多选和单选

分组select选择器，支持多选和单选
演示
下载
赞赏支持
立刻微信赞赏支持 关闭

 

XML/HTML Code
  1. <div class="wrapper">  
  2.             <div id="justAnInputBox1" class="select-tree-wrap"></div>  
  3.             <div id="justAnInputBox2" class="select-tree-wrap"></div>  
  4.         </div>  

 

JavaScript Code
  1. <script>  
  2.             // $.ajax({  
  3.             //  url: '',  
  4.             //  type: 'post',  
  5.             //  contentType : "application/json;charset=utf-8",  
  6.             //  dataType:'json',  
  7.             //  success: function(data) {  
  8.             //  
  9.             //  }  
  10.             // });  
  11.   
  12.             var SampleJSONData = [  
  13.                 {  
  14.                     "id": '73A64FDAFFC',  
  15.                     "title": "总裁办",  
  16.                             "subs": [  
  17.                         {  
  18.                             "id": '73At4FDoFFC',  
  19.                             "title": "张三"  
  20.                         },  
  21.                                     {  
  22.                             "id": '73At4FpAFFC',  
  23.                             "title": "李四"  
  24.                         },  
  25.                         {  
  26.                             "id": '73AtwFDAFFC',  
  27.                             "title": "数据中心",  
  28.                             "subs": [  
  29.                                 {  
  30.                                     "id": '13At4FDAFFC',  
  31.                                     "title": "王五"  
  32.                                 },  
  33.                                 {  
  34.                                     "id": '83At4FDAFFC',  
  35.                                     "title": "赵武"  
  36.                                 },  
  37.                                                     {  
  38.                                     "id": '83Al4FDAFFC',  
  39.                                     "title": "通讯中心",  
  40.                                                             "subs": [  
  41.                                                                 {  
  42.                                                         "id": '73At4FmAFFC',  
  43.                                                         "title": "谢一"  
  44.                                                     },  
  45.                                                                 {  
  46.                                                         "id": '73At4FpAFFC',  
  47.                                                         "title": "谢四"  
  48.                                                     }  
  49.                                                             ]  
  50.                                 }  
  51.                             ]  
  52.                         }  
  53.                     ]  
  54.                 },  
  55.                 {  
  56.                     "id": '72A64FDAFFC',  
  57.                     "title": "技术部",  
  58.                     "subs": [  
  59.                         {  
  60.                             "id": '73At4FDAFFC',  
  61.                             "title": "赵小刚"  
  62.                         },  
  63.                         {  
  64.                             "id": '73AtuFDAFFC',  
  65.                             "title": "李小刚"  
  66.                         },  
  67.                         {  
  68.                             "id": '73yt4FDAFFC',  
  69.                             "title": "王小刚"  
  70.                         }  
  71.                     ]  
  72.                 }  
  73.             ];  
  74.   
  75.             let aaa = $('#justAnInputBox1').comboTree({  
  76.                     source : SampleJSONData,  
  77.                     isMultiple: false,  
  78.                     isFirstClassSelectable:false, //第一级是否可选  
  79.                     cascadeSelect: true,  
  80.                     selectedlength:3 //最多可选  
  81.             });  
  82.   
  83.             let bbb = $('#justAnInputBox2').comboTree({  
  84.                     source : SampleJSONData,  
  85.                     isMultiple: true,  
  86.                     isFirstClassSelectable:false, //第一级是否可选  
  87.                     cascadeSelect: true,  
  88.                     selectedlength: 100 //最多可选  
  89.             });  
  90.   
  91.             // bbb.datas(); //获取数据  
  92.   
  93.         </script>  

 


原文地址:http://www.freejs.net/article_biaodan_954.html