webapp万能选择器:iosselect
iosselect是个什么东西?
移动端浏览器对于select的展示样式是不一致的,ios下是类似原生的picker,安卓下各浏览器展示各异,我们需要一个选择器组件来统一各端下各种浏览器的展示。下面是它的一个截图:

iosselect 项目地址:
文档和demo可以访问github:https://github.com/zhoushengmufc/iosselect
iosselect能做什么?
移动端开发中,经常遇到选择器功能,常见的时间选择,日期选择,地区选择,单列选择。iosselect完美实现一个组件实现各种选择器的功能。
先看demo:
一级级联,银行选择
http://zhoushengfe.com/iosselect/demo/one/bank.html
二级级联,三国杀将领组合选
http://zhoushengfe.com/iosselect/demo/two/sanguokill.html
三级级联,省市区选择
http://zhoushengfe.com/iosselect/demo/three/area.html
viewport缩放时处理方案
http://zhoushengfe.com/iosselect/demo/rem/bank.html
日期选择器 三级联动,通过方法获取数据,并且有加载中效果
http://zhoushengfe.com/iosselect/demo/datepicker/date.html
日期时间选择器,共五级,通过方法获取数据
http://zhoushengfe.com/iosselect/demo/five/time.html
iosselect的优势
iosselect接口丰富,适用于多类场景
可以定制依赖关系,规定各层级之间是否有关联。
可以定制选择层级,支持1-5层选择。
可以定制各项高度,可以规定展示项数,默认展示7项。
移动端rem应用普遍,无论你是px还是rem,使用iosselect都完全不是问题。
可以提供静态数据,也可以使用方法获取数据,支持同步方法和异步方法。
iosselect基于iscroll5开发,除此外无任何依赖,所以无论你是react还是angular还是vue还是zepto jquey都不是问题。


webapp万能选择器:iosselect的更多相关文章
- H5万能选择器:iosselect
iosselect是个什么东西? 移动端浏览器对于select的展示样式是不一致的,ios下是类似原生的picker,安卓下各浏览器展示各异,我们需要一个选择器组件来统一各端下各种浏览器的展示.下面是 ...
- webapp通用选择器:iosselect
1,这个组件解决什么问题 在IOS系统中,safari浏览器的select标签默认展示样式和iOS-UIPickerView展示方式一致,形如下图: 这个选择器操作方便,样式优美.但是在安卓系统中展示 ...
- vue 中使用querySelect 封装的万能选择器
function query (el) { if (typeof el === 'string') { var selector = el; el = document.querySelector(e ...
- iosselect:一个js picker项目,在H5中实现IOS的select下拉框效果
具体文档和demo可以访问github:https://github.com/zhoushengmufc/iosselect 移动端浏览器对于select的展示样式是不一致的,ios下是类似原生的pi ...
- 前端笔记之jQuery(上)加载函数的区别&对象&操作HTML/CSS&动画&选择器
一.jQuery简介 1.0 JavaScript编程比较恶心的地方 恶心1:选择元素麻烦,全线兼容的方法只有getElementById()和getElementsByTagName()两个.其他的 ...
- jQuery编程的最佳实践
好像是feedly订阅里看到的文章,读完后觉得非常不错,译之备用,多看受益. 加载jQuery 1.坚持使用CDN来加载jQuery,这种别人服务器免费帮你托管文件的便宜干嘛不占呢.点击查看使用CDN ...
- jQuery最佳编程实践
加载jQuery 1.坚持使用CDN来加载jQuery,这种别人服务器免费帮你托管文件的便宜干嘛不占呢.点击查看使用CDN的好处,点此查看一些主流的jQuery CDN地址. <script t ...
- Web 前端最佳实践
Web 最佳实践 前端 选择器 尽量使用ID选择器 基于Id的选择器:先使用ID选择器定位,然后再使用find方法精确查找 // Fast: $( "#container div ...
- jquery实践
转:http://www.cnblogs.com/Wayou/p/jquery_best_prictise.html jQuery编程的最佳实践 好像是feedly订阅里看到的文章,读完后觉得非常 ...
随机推荐
- 路径正确下,Eclipse读取txt文件仍失败
症状:使用Eclipse读取文件时,路径输入确认正确(前提!!!),但控制台总报错: 错误类型一: Exception in thread "main" java.io.FileN ...
- iOS开发之Run Loop
1.概述 (1) Run Loop提供了一种异步执行代码的机制,不能并行执行任务. (2) 在主队列中,Main Run Loop直接配合任务的执行,负责处理UI事件.计时器,以及其它内核相关事件. ...
- iOS开发之数据存储之NSData
1.概述 使用archiveRootObject:toFile:方法可以将一个对象直接写入到一个文件中,但有时候可能想将多个对象写入到同一个文件中,那么就要使用NSData来进行归档对象. NSDat ...
- Unity无缝循环世界实现
一年前曾经碰到过已无限世界为题材的游戏开发比赛,虽然对比赛没有兴趣,但是对这个题材倒是有点想法.如何通过unity3d实现无缝的循环世界呢. 有一种想法是动态生成,一块场景一块场景进行动态加载.(做过 ...
- Linux下搭建mpi集群(ubuntu下用虚拟机测试)
一 建立SSH连接(无密码登陆) 1 SSH连接的简单介绍 SSH 为 Secure Shell 的缩写,中文翻译为安全外壳协议,建立在应用层,是一种远程连接安全协议.传统的telnet,pop,ft ...
- 数位dp——hud3652
B-number Time Limit: 2000/1000 MS (Java/Others) Memory Limit: 32768/32768 K (Java/Others) Problem ...
- webpack2.x基础属性讲解(一)
webpack作为构建工具平时作为前端作为优化.模块编程.和分片打包的重要组成部分,大家可能并不陌生,如果没有时刻的去关注文档,那么大家可能不太清楚webpack已经默默然的升级到2.x了,对比1 ...
- 整合初步--------->SSH(注解版)
上面的一篇博客已经介绍了 Spring和Hibernate之间的整合,没看过的童鞋可以去看看,这篇博客讲解Spring+Hibernate+Struts2注解版......... 个人觉得使用注解可能 ...
- yii2-验证规则,rules,判断条件
yii2模型的验证规则,简单的使用我就不详细说了,想看的可以去看官网教程http://www.yiichina.com/doc/guide/2.0/structure-models#validatio ...
- Visual Studio 2017无法加载Visual Studio 2015创建的SharePoint解决方案
前几天安装了最新的Visual Studio 2017企业版,发现无法打开之前使用Visual Studio 2015创建的SharePoint 2016解决方案,提示"需要更新" ...