一个简单易用的下拉表单，可选择多个选项

一个简单易用的下拉表单，可选择多个选项

这是1.3版本 目前只有两种选择框形式 一个页面可以使用多个选择框！您只需要新建实例对象即可

演示地址：https://iiasdafdf.github.io/Dselector/

1.使用方法： 1.1定义一个容器

<div class="selector"></div> <button class="button" onclick="getData()">点我在控制台输出选择的数据</button>

1.2引入此插件

<script src="Dselector.js" type="text/javascript"></script>

1.3实例化对象

定义第一个选择框 var SE=new Dselect({//Dselect对象实例化 el:'.selector',//绑定容器 data:[22,33,44,55,66,77],//初始化数据，数据格式为数组或对象数组 width:'300px',//定义宽度 }) 定义第二个选择框 var SE2=new Dselect({ el:'.selector2', data:[{aa:66},{aa:77},{aa:99},{aa:29},{aa:30},{aa:41}], key:'aa',//如果您输入的数据类型是一个对象数组，您需要定义‘key’,'key'的值将作为option的显示文本 width:'300px', group:1,//限制可选最大个数 color:"chocolate"//您可以定义您的选择框皮肤颜色 }) 定义第三个选择框 var SE3=new Dselect({ el:'.selector3', data:[{aa:66},{aa:77},{aa:99},{aa:29},{aa:30},{aa:41}], key:'aa',//如果您输入的数据类型是一个对象数组，您需要定义‘key’,'key'的值将作为option的显示文本 width:'300px', module:'typeTwo',//开启第二种模式 可以输入和下拉，此模式只能单选 match:'greedy'//在typeTwo模式下可以开启匹配功能，'upmake'为摄取模式，符合js字符串匹配规则,'greedy'为贪婪模式,可以不按照字符顺序进行匹配 })

1.4输出选择的结果

function getData(){//您只需要拿取Dselect实例对象的Selected，即可得到您选择的数据 console.log(SE.Selected) }

new!!!增加onchange事件！当选择内容改变时 onchange事件会触发！

使用方法！SE.onchange=function(){console.log(this.Selected)}