https://github.com/zhoushengmufc/iosselect/

iosselect是个什么东西？

移动端浏览器对于select的展示样式是不一致的，ios下是类似原生的picker，安卓下各浏览器展示各异，我们需要一个选择器组件来统一各端下各种浏览器的展示。

特点
0依赖，只需引用一个js和css即可
样式可自己定制，也可使用默认样式
一个页面同时实例化多个组件
jquery zepto angular vue react均适用
支持最多6级级联
支持设置高度和高度单位
适用于android和iOS设备(PC端支持IE9+，不过PC端上滑动体验不太实用)

iosselect 项目地址：

文档和demo可以访问github:https://github.com/zhoushengmufc/iosselect

iosselect能做什么？

移动端开发中，经常遇到选择器功能，常见的时间选择，日期选择，地区选择，单列选择。iosselect完美实现一个组件实现各种选择器的功能。

可做：

一级级联，例如银行选择

二级级联，例如三国杀将领组合选

三级级联，例如省市区选择

日期选择器 三级联动，通过方法获取数据，并且有加载中效果

日期时间选择器，共五级，通过方法获取数据

iosselect的优势

点击下载文件到项目目录中，在HTML文件中插入以下代码，并按需调整路径。

options
type: object
其余选项，含以下几个属性：

options.container
default: ‘’
type: string
实例化后的对象包裹元素，可选项

options.callback
default: undefined
type: function
选择完毕后的回调函数，必选项 options.callback(selectOneObj, selectTwoObj, selectThreeObj, selectFourObj, selectFiveObj, selectSixObj) selectNumberObj为每级对应选中项，包含对应数据的所有字段及dom对象

options.fallback
default: undefined
type: function
选择取消后的回调函数，可选项

options.maskCallback
default: undefined
type: function

点击背景层关闭组件时触发的方法，可选项

options.title
default: ‘’
type: string
显示标题，可选项

options.sureText
default: ‘确定’
type: string
设置确定按钮文字，可选项

options.closeText
default: ‘取消’
type: string
设置取消按钮文字，可选项

options.itemHeight
default: 35
type: number
每一项的高度，可选项

options.itemShowCount
default: 7
type: number
组件展示的项数，可选项，可选3,5,7,9，不过不是3,5,7,9则展示7项

options.headerHeight
default: 44
type: number
组件标题栏高度，可选项

options.cssUnit
default: ‘px’
type: string
元素css尺寸单位，可选项，可选px或者rem

options.addClassName
default: ‘’
type: string
组件额外类名，用于自定义样式，可选项

options.relation
default: [0, 0, 0, 0, 0]
type: …Array
[oneTwoRelation, twoThreeRelation, threeFourRelation, fourFiveRelation, fiveSixRelation] 可选项。如果数据是数组(非方法)，各级选项之间通过parentId关联时，需要设置；如果是通过方法获取数据，不需要该参数。

options.relation.oneTwoRelation
default: 0
type: number
第一列和第二列是否通过parentId关联，可选项

options.relation.twoThreeRelation
default: 0
type: number
第二列和第三列是否通过parentId关联，可选项

options.relation.threeFourRelation
default: 0
type: number
第三列和第四列是否通过parentId关联，可选项

options.relation.fourFiveRelation
default: 0
type: number
第四列和第五列是否通过parentId关联，可选项

options.relation.fiveSixRelation
default: 0
type: number
第五列和第六列是否通过parentId关联，可选项

options.oneLevelId
type: string
实例展示时，第一级数据默认选中值，可选项，默认为第一级数据第一项id

options.twoLevelId
type: string
实例展示时，第二级数据默认选中值，可选项，默认为第二级数据第一项id

options.threeLevelId
type: string
实例展示时，第三级数据默认选中值，可选项，默认为第三级数据第一项id

options.fourLevelId
type: string
实例展示时，第四级数据默认选中值，可选项，默认为第四级数据第一项id

options.fiveLevelId
type: string
实例展示时，第五级数据默认选中值，可选项，默认为第五级数据第一项id

options.sixLevelId
type: string
实例展示时，第6级数据默认选中值，可选项，默认为第6级数据第一项id

options.showLoading
default: false
type: boolean
实例展示时，在数据加载之前下拉菜单是否显示加载中的效果，建议ajax获取数据时设置为true

options.showAnimate
default: false
type: boolean
是否显示入场动画和退场动画，如需自定义动画效果，请覆写.fadeInUp .layer和.fadeOutDown .layer的css3动画。PS:动画时间为0.5秒。