基于jquery的可查询多级select控件（可记录历史选择）

一、功能和使用

公司有功能需求，还要一条代码引入的控件，网上找完全符合的控件比较难，寻找所花的时间还不如自己写一个，所以找个空闲时间自己写了一个

控件功能：1、可手动输入查询，也可点击下拉框查询，

2、输入时实时定位到下拉框，enter补全

3、可多级查询（目前是写到二级）

4、localStorage存储历史记录

控件使用：引入相应的js和css文件，需要控件的html中加一个div

<div id="multiple_select" class="multiple-select-container"></div>

js里引入控件

$("#multiple_select").multiSelect({

         type:'2',//可选择几级数据

         data:data.list,

　　　　　　noneSelectedText: '请选择',

         field:['provence','city','name']  //option字段，【一级字段，二级字段，显示字段】

  });

二、代码

HTML

<!DOCTYPE html>

<html>

  <head>

    <meta charset="UTF-8">

    <title>树形控件</title>

    <link rel="stylesheet" type="text/css" href="./multiSelect.css" />

  </head>

  <body style="padding:100px;">

      <div id="multiple_select" class="multiple-select-container"></div>

  <script src="plugins/jquery-1.10.2.js"></script>

  <script src="./multiSelect.js"></script>

  <script>

    $(function(){

      //测试用的数据

      var data = {

      list:[{

              provence:"湖北",

              city:[{name:"武汉",code:}, {name:"仙桃",code:},{name:"天门",code:}]

          },

            {

              provence:"河北",

              city:[{name:"石家庄",code:}, {name:"邯郸",code:},{name:"唐山",code:}]

          },{

              provence:"湖南",

              city:[{name:"郴州",code:}, {name:"岳阳",code:},{name:"长沙",code:}]

          }]

      }

      //控件引用

      $("#multiple_select").multiSelect({

         type:'',//可选择几级数据

         data:data.list,

         field:['provence','city','name'] , //option字段,第一个是1级展示数据的字段，第二个是二级数据字段，第三个是显示字段

　　　record: true,  //是否需要历史记录功能，只展示最近使用的前三条数据

        noneSelectedText : '',　//未选择时展示数据

      });

    });

  </script>

  </body>

</html>

CSS

* {

    padding: 0;

    margin: 0;

}

ul li {

    list-style: none;

}

/*fontclass*/

@font-face {

    font-family: "iconfont";

    src: url('iconfont.eot?t=1537237853618');

    /* IE9*/

    src: url('iconfont.eot?t=1537237853618#iefix') format('embedded-opentype'), /* IE6-IE8 */

    url('data:application/x-font-woff;charset=utf-8;base64,d09GRgABAAAAAAVYAAsAAAAACCQAAQAAAAAAAAAAAAAAAAAAAAAAAAAAAABHU1VCAAABCAAAADMAAABCsP6z7U9TLzIAAAE8AAAARAAAAFY8hUioY21hcAAAAYAAAABoAAABquZlt9xnbHlmAAAB6AAAAV8AAAG8iReSsmhlYWQAAANIAAAALAAAADYSq0zoaGhlYQAAA3QAAAAcAAAAJAfeA4ZobXR4AAADkAAAAA4AAAAUFAAAAGxvY2EAAAOgAAAADAAAAAwA2AFKbWF4cAAAA6wAAAAfAAAAIAESADtuYW1lAAADzAAAAUUAAAJtPlT+fXBvc3QAAAUUAAAAQgAAAFf+vnWeeJxjYGRgYOBikGPQYWB0cfMJYeBgYGGAAJAMY05meiJQDMoDyrGAaQ4gZoOIAgCKIwNPAHicY2BkYWCcwMDKwMHUyXSGgYGhH0IzvmYwYuRgYGBiYGVmwAoC0lxTGBye8T/bxtzwv4EhhrmBoQEozAiSAwDr4gyoeJztkcENgCAMRV8FjTEmhj0cwKPDeHI/GalrYFscw08e+f1pORRgBJKxGxnkRnBdlkrkiSXyzGH1bGcA3bRobe1zj7uQRMccr4nNWq9M/FrjPr8q+9464UvHN65Px39Fa4fhBcRnF9R4nE2QP0/CQBiH732vtrRXwcT+wRBabWKLS4lt02646IgTwbBRZhkYlX4BExNC4uTiqFE+BHwL+DBePFoTveF+l8tzz+/yEiRi0RHuCCMBIVAHxQG7B1kIx5Yhe11QZM9PriDwkzRyIUsjy2gASssNpZvlci1Ja4dZbX1eMMfUikIzHVbM9bbFCtxK64oQO4+ZuJvPBcuK4t9ZlJZ/eMUJMQjJVLCi1A9EYeDLCsgORNknDGCku01o8JfaAbITxhcqNF19BXf8i9muDvc1CpKk8oXA9D/neO9U0fdkywbbsq00gzQET6FDvuLvpVO8LZ0wK5044B8w3EtFWSmFWSmlpXNGL8kROSMhIedeiEkPIweNOlKvjoaDUQ+TEEHuQjUwMUR4u3nMoyh/fKriOpv0O53+ZFoFPByynWa22FYznuOKisf7iHHcuc1/sWnev/g+BbZlLVPbsZbxAzYBVaMAeJxjYGRgYADikyacs+P5bb4ycLMwgMD1Yy2xyDQLA7MhkOJgYALxAArgCJB4nGNgZGBgbvjfwBDDwgACQJKRARWwAgBHCwJueJxjYWBgYEHDAAEEABUAAAAAAAAAQgBsAJYA3nicY2BkYGBgZdBnYGYAASYg5gJCBob/YD4DAA2tAU4AeJxlj01OwzAQhV/6B6QSqqhgh+QFYgEo/RGrblhUavdddN+mTpsqiSPHrdQDcB6OwAk4AtyAO/BIJ5s2lsffvHljTwDc4Acejt8t95E9XDI7cg0XuBeuU38QbpBfhJto41W4Rf1N2MczpsJtdGF5g9e4YvaEd2EPHXwI13CNT+E69S/hBvlbuIk7/Aq30PHqwj7mXle4jUcv9sdWL5xeqeVBxaHJIpM5v4KZXu+Sha3S6pxrW8QmU4OgX0lTnWlb3VPs10PnIhVZk6oJqzpJjMqt2erQBRvn8lGvF4kehCblWGP+tsYCjnEFhSUOjDFCGGSIyujoO1Vm9K+xQ8Jee1Y9zed0WxTU/3OFAQL0z1xTurLSeTpPgT1fG1J1dCtuy56UNJFezUkSskJe1rZUQuoBNmVXjhF6XNGJPyhnSP8ACVpuyAAAAHicY2BigAAuBuyAlZGJkZmRhZGVkY2BJzknvzhVNzmzKDknlSOxqCi/XLe0gAvCSMkvz2MrTk0sSs5gYAAATLsOxwAA') format('woff'), url('iconfont.ttf?t=1537237853618') format('truetype'), /* chrome, firefox, opera, Safari, Android, iOS 4.2+*/

    url('iconfont.svg?t=1537237853618#iconfont') format('svg');

    /* iOS 4.1- */

}

.iconfont {

    font-family: "iconfont" !important;

    font-size: 16px;

    font-style: normal;

    -webkit-font-smoothing: antialiased;

    -moz-osx-font-smoothing: grayscale;

}

.icon-close-circle:before {

    content: "\e611";

}

.icon-arrow-up:before {

    content: "\e6b6";

}

.icon-arrow-down:before {

    content: "\e6b5";

}

.icon-search:before {

    content: "\e60f";

}

/*fontclass end*/

.multiple-select-container {

    width: 166px;

    height: 34px;

    line-height: 34px;

    position: relative;

    display: inline-block;

    vertical-align: middle;

}

.multiple-select-container .select-inputbox {

    width: 100%;

    height: 40px;

    line-height: 40px;

    padding: 0 9px;

    position: relative;

    box-sizing: border-box;

}

.multiple-select-container .select-input,

.multiple-select-container .select-button {

    width: 100%;

    height: 100%;

    outline: none;

    box-sizing: border-box;

    background: #FFF;

}

.multiple-select-container .select-input {

    padding: 5px 22px;

    border-radius: 2px;

    border: 1px solid #CFCFCF;

    height: 28px;

}

.multiple-select-container .select-button {

    padding: 5px 25px 5px 12px;

    border: 1px solid #CFCFCF;

    border-radius: 4px;

    text-align: left;

    display: flex;

    justify-content: space-between;

}

.multiple-select-container .select-button span {

    display: inline-block;

    height: 100%;

    line-height: 22px;

}

.multiple-select-container .selected-data {

    width: 80%;

    color: #333;

    overflow: hidden;

    text-overflow: ellipsis;

    white-space: nowrap;

}

.multiple-select-container .input-isfold {

    float: right;

    cursor: pointer;

    margin-right: -16px;

    font-size: 12px;

}

.multiple-select-container .input-search,

.multiple-select-container .input-close {

    position: absolute;

    cursor: pointer;

    top: 50%;

    transform: translateY(-50%);

    display: inline-block;

    height: 16px;

    line-height: 16px;

    font-size: 18px;

}

.multiple-select-container .input-close {

    left: calc(95% - 22px);

    width: 12px;

    color: #7B7B7B;

    display: none;

}

.multiple-select-container .input-search {

    color: #ADADAD;

    left: 12px;

    width: 16px;

}

.multiple-select-container .select-options-box {

    width: 100%;

    display: none;

    position: absolute;

    border: 1px solid #c2cad8;

    z-index: 999999;

    background: #fff;

    height: 300px;

    overflow-y: auto;

}

.multiple-select-container .options-container {

    width: 100%;

    height: auto;

}

.multiple-select-container .options-record,

.multiple-select-container .optionslist {

    font-size: 14px;

    width: 100%;

    box-sizing: border-box;

    padding: 0 9px;

    text-align: left;

}

.multiple-select-container .options-record {

    color: #999;

    height: 34px;

    line-height: 34px;

}

.multiple-select-container .optionslist {

    cursor: pointer;

    height: 26px;

    line-height: 26px;

}

.multiple-select-container .optionslist:hover {

    background: #DEEDFF;

}

.multiple-select-container .options-one {

    font-size: 16px;

}

.multiple-select-container .options-two {

    width: 100%;

    font-size: 14px;

}

.multiple-select-container .options-two li {

    padding-left: 15px;

}

.multiple-select-container .options-isfold {

    float: right;

    display: inline-block;

    width: 16px;

}

.multiple-select-container .active-border {

    border: 1px solid #009BE1;

}

.multiple-select-container .background-color {

    background: #ECECEC!important;

}

.multiple-select-container .border-bottom {

    border-bottom: 2px solid #D4D4D4;

}

::-webkit-scrollbar {

    width: 5px;

    height: 5px;

}

::-webkit-scrollbar-thumb {

    background: #DCDCDC;

    border-radius: 8px;

}

 ;

 (function($, window, document) {

     var pluginName = 'multiSelect',

         defaults = {

             type: '1', //select层级onetwo

             data: [], //数据

             field: [], //数据字段名

             record: false, //是否记录最近使用的三条数据

             chooselast: true, //是否在初始化后自动选择最近使用的选项，record必须为true

             noneSelectedText: '', //未选择时显示文字

             isfoldFirst: false, //是否默认展开二级目录

             disabled: '', //是否禁用

             hasinput: true, //是否显示搜索框

             id: '', //id字段名

             allselect: '', //全选或者不选择

             queryFun: function() {}, //搜索方法

         };

     function MultiSelect(element, options) {

         this.element = element;

         this.settings = $.extend({}, defaults, options);

         this.init();

     }

     MultiSelect.prototype = {

         //初始化弹出框

         init: function() {

             var that = this,

                 element = this.element;

             that.create(element);

             that.triggerlist(element);

         },

         //创建select框

         create: function(element) {

             var that = this,

                 $this = $(element),

                 noneSelectedText = that.settings.noneSelectedText,

                 selectElement = '<button name="selectinput" class="select-button">' +

                 '<span id="selected_data" class="selected-data">' + noneSelectedText + '</span><span class="input-isfold iconfont icon-arrow-down"></span></button>' +

                 '<div class="select-options-box" id="select_options_box"></div>';

             $this.append(selectElement);

             var $options_box = $this.find('#select_options_box');

             $this.on({

                 'hideoptions': function(e) {

                     $options_box.fadeOut();

                     $this.find('.input-isfold').toggleClass('icon-arrow-down icon-arrow-up');

                 },

                 'showoptions': function(e) {

                     $options_box.fadeIn();

                     $this.find('.input-isfold').toggleClass('icon-arrow-down icon-arrow-up');

                 }

             });

             that.initOption(element);

         },

         //初始化列表

         initOption: function(element) {

             var that = this,

                 $this = $(element),

                 $options_box = $this.find('#select_options_box');

             var $options = that.parseOptions();

             $options_box.html($options);

         },

         //解析并处理options数据

         parseOptions: function() {

             var that = this,

                 type = that.settings.type,

                 field = that.settings.field,

                 one = field[0],

                 two = field[1],

                 data = that.settings.data,

                 allselect = that.settings.allselect,

                 hasinput = that.settings.hasinput,

                 disabled = that.settings.disabled,

                 twolist = '',

                 optionsTwo = [],

                 record = that.settings.record,

                 noneSelectedText = that.settings.noneSelectedText,

                 options = '';

             var recordColumn = JSON.parse(window.localStorage.getItem("recordInfo")) ? JSON.parse(window.localStorage.getItem("recordInfo")) : [];

             console.log("recordColumn" + recordColumn);

             options += '<div class="options-container">';

             if (record && recordColumn.length > 0) {

                 options += '<div class="options-record"><span class="options-data">最近使用</span>' +

                     '</div>';

                 for (var i = 0; i < recordColumn.length; i++) {

                     if (recordColumn[i] != undefined && JSON.stringify(data).indexOf(JSON.stringify(recordColumn[i].id)) >= 0) {

                         options += '<div class="optionslist" disabled="' + disabled + '" id="' + recordColumn[i].id + '" data-index=' + recordColumn[i].dataIndex + '">' +

                             '<span class="options-data">' + recordColumn[i][one] + '</span></div>';

                     } else {

                         recordColumn.splice(i, 1);

                         window.localStorage.setItem("recordInfo", JSON.stringify(recordColumn));

                     }

                 }

             }

             if (noneSelectedText) {

                 options += '<div class="options-record optionslist" id="none_selected_all"><span class="options-data">' + noneSelectedText + '</span></div>';

             }

             if (hasinput) {

                 options += '<div class="select-inputbox"><input type="text" name="selectinput" id="select_input" class="select-input" placeholder="" />' +

                     '<i class="input-search iconfont icon-search"></i>' +

                     '<i class="input-close iconfont icon-close-circle"></i></div>';

             }

             switch (type) {

                 case '1':

                     for (var i in data) {

                         options += '<div class="optionslist" disabled="' + disabled + '" id="' + data[i].id + '" data-index="' + i + '"><span class="options-data">' + data[i][one] + '</span></div>';

                     }

                     break;

                 case '2':

                     for (var i in data) {

                         twolist = '', optionsTwo = [];

                         var optionsTwo = data[i][two];

                         for (var j in optionsTwo) {

                             twolist += '<li class="options-container optionslist" disabled="' + disabled + '" id="' + data[i].id + '" data-index="' + i + '" data-twoindex="' + j + '">' +

                                 '-- ' + '<span class="options-data">' + optionsTwo[j][field[2]] + '</span></li>';

                         }

                         options += '<div class="options-one optionslist" disabled="' + disabled + '" id="' + data[i].id + '" data-index="' + i + '">' +

                             '<span class="options-data">' + data[i][one] + '</span><span class="iconfont icon-arrow-up options-isfold"></span>' +

                             '</div>' +

                             '<ul class="options-two">' + twolist + '</ul>';

                     }

                     break;

             }

             options += '</div>';

             return options;

         },

         //系列事件

         triggerlist: function(element, event) {

             var that = this,

                 $this = $(element),

                 data = that.settings.data,

                 field = that.settings.field,

                 one = field[0],

                 two = field[1],

                 isfoldFirst = that.settings.isfoldFirst,

                 noneSelectedText = that.settings.noneSelectedText,

                 $options_box = $this.find('#select_options_box'),

                 $isfold = $this.find('.options-isfold'),

                 record = that.settings.record,

                 chooselast = that.settings.chooselast,

                 disabled = that.settings.disabled,

                 $input = $this.find('#select_input'),

                 $selected = $this.find('#selected_data'),

                 $button = $this.find('.select-button');

             var recordColumn = JSON.parse(window.localStorage.getItem("recordInfo")) ? JSON.parse(window.localStorage.getItem("recordInfo")) : [];

             $input.on({

                 'input propertychange': function() {

                     that.selectFun(false, false, element);

                 },

                 'click': function() {

                     $options_box.show();

                     return false;

                 }

             });

             $this.find('.input-search').on('click', function(event) {

                 $this.trigger('showoptions', e);

                 that.selectFun(false, false, element);

                 return false;

             });

             $this.find('.input-close').on('click', function(event) {

                 $options_box.show();

                 $input.val('');

                 $(this).hide();

                 return false;

             });

             $button.on('click', function(event) {

                 $(this).addClass('active-border');

                 $options_box.toggle();

                 that.selectFun(false, true, element);

                 $this.find('.input-isfold').toggleClass('icon-arrow-down icon-arrow-up');

                 event.stopPropagation();

             })

             $isfold.on('click', function(event) {

                     //  that.selectFun(false, true, element);

                     $(this).parent().next().toggle();

                     $(this).toggleClass('icon-arrow-down icon-arrow-up');

                     $options_box.show();

                     //  $this.trigger('showoptions');

                     event.stopPropagation();

                 })

                 //选择事件

             $this.find('.optionslist').on({

                 'click': function(event) {

                     if (disabled) return;

                     $button.removeClass('active-border');

                     $(this).addClass('background-color');

                     $this.find('.optionslist').removeAttr("selected");

                     $(this).attr("selected", "selected");

                     $selected.html($(this).find('.options-data').html());

                     if ($.isFunction(that.settings.queryFun)) {

                         that.settings.queryFun();

                     }

                     if ($(this).attr("id") === "none_selected_all") {

                         $button.data("data", null)

                         $selected.html(noneSelectedText);

                     } else {

                         var recordIndex = parseInt($(this).attr("data-index")),

                             twoIndex = parseInt($(this).attr("data-twoindex")),

                             a = {},

                             b = { dataIndex: recordIndex };

                         if ($(this).attr("data-twoindex")) {

                             a = data[recordIndex][two][twoIndex];

                         } else {

                             a = data[recordIndex];

                         }

                         recordCol = $.extend(a, b);

                         $button.attr("data-index", recordIndex);

                         $button.data("data", a)

                         if (record) {

                             //  console.log("recordCol：" + recordCol + " recordColumn：" + JSON.stringify(recordColumn));

                             var len = recordColumn.length,

                                 existIndex = -1;

                             //  if (JSON.stringify(recordColumn).indexOf(JSON.stringify(recordCol)) > -1) {

                             for (var i = 0; i < len; i++) {

                                 if (recordColumn[i].dataIndex == recordIndex) {

                                     existIndex = i;

                                 }

                             };

                             if (existIndex > -1) {

                                 recordColumn.splice(existIndex, 1);

                             }

                             //  };

                             recordColumn.unshift(recordCol);

                             len = recordColumn.length;

                             if (len > 3) {

                                 recordColumn.splice(3, len - 3);

                             }

                             window.localStorage.setItem("recordInfo", JSON.stringify(recordColumn));

                         }

                     }

                     // $button.attr("data", a)

                     $this.trigger('hideoptions');

                     event.stopPropagation();

                 },

                 'mouseover': function() {

                     $(this).css({ 'background': '#DEEDFF' });

                 },

                 'mouseout': function() {

                     $(this).css({ 'background': '#fff' });

                 }

             });

             $(document).keyup(function(event) {

                 if (event.keyCode === 13&&$input.is(':focus')) {

                     that.selectFun(true, false, element);

                     if ($.isFunction(that.settings.queryFun)) {

                         that.settings.queryFun();

                     }

                 }

                 event.stopPropagation();

             });

             /* $(document).on('click', function(event) {

                 $options_box.hide();

             }); */

             $(document).on('click', function(event) {

                 var _tar = $button.children();

                 if (!_tar.is(event.target) && _tar.has(event.target).length === 0) { // Mark 1

                     $options_box.fadeOut();

                     $button.removeClass('active-border');

                 }

             });

             if (chooselast && record && recordColumn.length > 0) {

                 $this.find('.optionslist').first().trigger("click");

             }

             if (!isfoldFirst) {

                 $isfold.trigger("click");

             }

         },

         // input与select同步

         selectFun: function(enter, button, element) { //enter为true代表是键盘enter键，button为true代表是select，为false代表是input搜索框

             var that = this,

                 $this = $(element),

                 data = that.settings.data,

                 $options_box = $this.find('#select_options_box'),

                 $input = $this.find('#select_input'),

                 options = $this.find('.optionslist'),

                 $selected = $this.find('#selected_data'),

                 optionTop = 0,

                 selectHTML = '';

             var optiondata = button ? $selected.html() : $input.val();

             if ($input.val()) {

                 $this.find('.input-close').show();

             } else {

                 $this.find('.input-close').hide();

             }

             $.each(options, function(i, item) {

                 selectHTML = $(item).find('.options-data').html();

                 // console.log(selected);

                 if (selectHTML.indexOf(optiondata) >= 0) {

                     // $(item).trigger('hover');

                     options.removeClass('background-color');

                     $(item).addClass('background-color');

                     /*if ($(item).hasClass('options-one')) {

                       optionTop = $(item).position().top;

                     }else{

                       optionTop = $(item).parent().position().top;

                     }*/

                     optionTop = $(item).position().top;

                     // console.log(optionTop);

                     $options_box.scrollTop(optionTop);

                     if (enter) {

                         $(item).trigger('click');

                     }

                 }

             });

             if (optiondata === '') {

                 options.removeClass('background-color');

                 $options_box.scrollTop(0);

             }

         }

     };

     $.fn[pluginName] = function(options) {

         this.each(function() {

             if (!$.data(this, "plugin_" + pluginName)) {

                 $.data(this, "plugin_" + pluginName, new MultiSelect(this, options));

             }

         });

         return this;

     };

     //外部获取选中数据

     $.fn.extend({

         optionSelected: function() {

             if ($(this).find("button").data("data")) {

                 return $(this).find("button").data("data");

             } else {

                 return "";

             }

         },

         setOption: function(id) {

             if (id && id != "" && id.length > 0) {

                 $(this).find("#" + id).trigger('click');

             }

         },

         setDisabled: function() {

             $(this).find("button").css("background-color", "#ccc");

             $(this).css("pointer-events", "none");

             $(this).parent().css("cursor", "no-drop");

         },

     });

 })(jQuery, window, document)

基于jquery的可查询多级select控件（可记录历史选择）的更多相关文章

jquery去重复如何去除select控件重复的option
#1.去除select控件重复的option <select id="companyId" onchange="getContract()" name=& ...
jQuery：实现两个<select>控件的互移操作
一.直接上代码 <!DOCTYPE html> <html> <head> <meta charset="utf-8" /> < ...
jquery 双向select控件bootstrap Dual listbox
http://www.cnblogs.com/hangwei/p/5040866.html -->jquery 双向select控件bootstrap Dual listboxhtt ...
Jquery 操作Html 控件 CheckBox、Radio、Select 控件【转】http://www.cnblogs.com/lxblog/archive/2013/01/09/2853056.html
Jquery 操作Html 控件 CheckBox.Radio.Select 控件在使用 Javascript 编写前台脚本的时候,经常会操作 Html 控件,比如 checkbox.radio ...
Jquery 操作Html 控件 CheckBox、Radio、Select 控件
在使用 Javascript 编写前台脚本的时候,经常会操作 Html 控件,比如 checkbox.radio.select,用 Jquery 库操作其他会方便很多,下面用Jq对这些控件的操作进行一 ...
基于vue.js实现远程请求json的select控件
基本思路前端把需要的参数类型编码传到后台,后台返回相应的参数列表json,前端利用vue渲染select控件具体实现前端代码 <select v-model="template. ...
jquery仿jquery mobile的select控件效果
不说废话.直接上代码 //仿jQuery mobile Select控件 //使用方法box为容器id,_id指控件id,selectvalue为选中值,Value为当前值 function Sele ...
Jquery+json绑定带层次下拉框（select控件）
一.实现的效果图备注: 1.主要实现添加类别绑定到Ztree树之后,select下拉框在不刷新页面的情况下,通过Jquery重新绑定问题,增加用户体验度: 2.这个只是实现两层的绑定,通过sql语句 ...
html select控件的jq操作
html select控件的jq操作 1.判断select选项中是否存在Value="paraValue"的Item $("#selectid option[@valu ...

随机推荐

[ES6]import 与export的用法，export 与export default 的区别以及用法
一.import 与export export(导出):用于对外输出本模块(一个文件可以理解为一个模块)变量的接口: import(导入):用于在一个模块中加载另一个含有export接口的模块. 1. ...
Metasploit没有db_autopwn命令的解决办法
将附件db_autopwn.rp 拷贝到/opt/framework3/msf3/plugins/PS:db_autopwn.rp 下载地址:http://dl.vmall.com/c04w8czlc ...
iOS开发图片加载的内存问题及优化方案
原创作者:Magic-Unique 原文地址:https://github.com/Magic-Unique/HXImage猿吧 - 资源共享论坛: http://www.coderbar.cn 做最 ...
Factorialize a Number
计算一个整数的阶乘如果用字母n来代表一个整数,阶乘代表着所有小于或等于n的整数的乘积. 阶乘通常简写成 n! 例如: 5! = 1 * 2 * 3 * 4 * 5 = 120 当你完成不了挑战的时候 ...
[转载]各种java生成word解决方案的优缺点对比
解决方案优点缺点 Jacob 功能强大直接调用VBA接口,程序异常复杂:服务器必须是:windows系统+安装Office:服务器端自动化com接口容易产生死进程造成服务器宕机 Apache P ...
在js中做数字字符串补0
转自(http://blog.csdn.net/aimingoo/article/details/4492592) 通常遇到的一个问题是日期的“1976-02-03 HH:mm:ss”这种格式 ,我的 ...
【zznu-2173】
题目链接题目描述春天自幼学习人间大道,斩断情缘,现已修成正果,势必要斩尽巨魔.某朝末年,战乱四起,民不聊生,魔界与人间界的封印减弱,n只巨魔趁机降临人间,祸乱百姓.n只巨魔只知扰乱人间,会有天谴降 ...
MATLAB基础知识tips
网络论坛资源: MATLAB中文论坛https://i.cnblogs.com/EditPosts.aspx?opt=1 circshift 移位函数,circshift(A,SHIFTSIZE).S ...
DRF中两大视图基类APIView/GenericAPIView的介绍
(1)APIView rest_framework.views.APIView APIView是REST framework提供的所有视图的基类,继承自Django的View父类. APIView与V ...
New Concept English there （8）
31w/m 56% The Great St Bernard Pass connects Switzerland to Italy. At 247o metres, it is the highest ...

基于jquery的可查询多级select控件（可记录历史选择）

一、功能和使用

二、代码

基于jquery的可查询多级select控件（可记录历史选择）的更多相关文章

随机推荐

热门专题