Mobiscroll手机触屏日期选择器

最近在制作jquery mobile因要用到日历控件,突然发现Mobiscroll非常不错。于是摘下来记录。
A Mobiscroll是一个用于触摸设备(Android phones、iPhone、 iPad、Galaxy Tab)的日期和时间选择器jQuery插件。可以让用户很方便的只需要滑动数字就可以选择日期。Mobiscroll作为一款jQuery日期插件可以让用户自定义主题,完全通过CSS文件修改样式,经过测试可以完美使用在iOS4、Android 2.2、 Android 2.3的浏览器、Saf
默认有两种风格:Default 与专门配合jq mobile的风格。下面我们来看一下设置方法:
$("#birthday").scroller($.extend(
{
preset :"date",//日期形式 date|datetime|time
minDate: new Date(1985,7,30),//最小日期
maxDate: new Date(1995,12,30) //最大日期
},{
theme: "default",//风格配置 jqm|default 默认default
mode: "scroller",//滚动模式 scroller|clickpick|mixed 默认scroller
display: "modal",//显示模式 modal|inline|bubble|top|bottom 默认modal
lang: "en-US" //默认en-US
}
));
配置相对比较易懂一点。关键是语言只有英语呀,不过修改一下即可的:如 setText: "Set", cancelText: "Cancel", 分别是“确定与取消”文本。包括上面显示的年月日
monthText: "月",
dayText: "日",
yearText: "年",
hourText: "时",
minuteText: "分",
secText: "秒",
ampmText: " ",
nowText: "现在",
还有一个关键问题,默认排版是 月-日-年 这对我们来说有点别扭,调整方法是修改:dateOrder: "mmddy" 为 dateOrder: "ymmdd" 随便改一下前面的dateFormat: "mm/dd/yy",为dateFormat: "yy-mm-dd",
总体感觉就差不多了,如果你还想改什么,不防好好研究一下!
Mobiscroll手机触屏日期选择器的更多相关文章
- HTML5学习总结-09 拖放和手机触屏事件
一 拖放 拖放(Drag 和 drop)是 HTML5 标准的组成部分.拖放是一种常见的特性,即抓取对象以后拖到另一个位置.在 HTML5 中,拖放是标准的一部分,任何元素都能够拖放. 课程参考 ht ...
- jQuery手机触屏拖动滑块验证跳转插件
HTML: <!DOCTYPE html> <html lang="en"> <head> <title>jQuery手机触屏拖动滑 ...
- 手机触屏滑动图片切换插件swiper.js
今天给大家分享一款手机触屏滑动图片切换插件swiper.js是一款swiper手机触屏滑动图片幻灯片,适合各种尺寸.效果图如下: 在线预览 源码下载 实现的代码. html代码: <div ...
- 手机触屏的js事件
处理Touch事件能让你跟踪用户的每一根手指的位置.你可以绑定以下四种Touch事件: 1.touchstart: // 手指放到屏幕上的时候触发 2.touchmove: // ...
- jquery手机触屏滑动拼音字母城市选择器代码
今天用到城市选择,直接用拼音滑动方式来选择,用的时候引入jquery(个别样式需要自己修改) <div class="yp_indz"><img src=&quo ...
- 手机触屏触摸特效javascript-TouchSwipe(依赖于jquery库)中文说明
by 郑州seo on 2013 年 7 月 6 日 in jquery, 网站建设 with 6 Comments 最近需要做一个手机小门户网站,因为目前主流的手机都是安卓和苹果的,他们的浏览器内核 ...
- HTML5调用手机的Datepicker(日期选择器)
HTML5 拥有多个新的表单输入类型.这些新特性提供了更好的输入控制和验证,包含了如下新的输入类型: email url number range Date pickers (date, month, ...
- jQuery手机触屏左右滑动切换焦点图特效代码
原文地址:http://www.17sucai.com/pins/4857.html 演示地址:http://www.17sucai.com/pins/demoshow/4857 干净演示地址:htt ...
- css3实现各种渐变效果,比较适合做手机触屏版
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
随机推荐
- Webmin LFD to LFI
Webmin < 1.290 / Usermin < 1.220 - Arbitrary File Disclosure (Perl) https://www.exploit-db.com ...
- linux下终端游戏
sl 一列火车 oneko 一只淘气的小猫
- Laravel 5.2 整合 Uploadify 上传图片
前端: <!-- 引入CSS.JS --> <link rel="stylesheet" type="text/css" href=" ...
- 105.Construct Binary Tree from Preorder and Inorder Traversal---《剑指offer》面试6
题目链接 题目大意:根据先序遍历和中序遍历构造二叉树. 法一:DFS.根据模拟步骤,直接从先序和中序数组中找值然后加入二叉树中,即先从先序数组中确定根结点,然后再去中序数组中确定左子树和右子树的长度, ...
- 12-6 NSArray
原文:http://rypress.com/tutorials/objective-c/data-types/nsarray NSArray NSArray 是 Objective-C中最常用的数组类 ...
- 字符串aaaa......bbbb....ccc...dddddd用正则替换为abcd
public static void main(String[] args) { String s = "aaaa......bbbb....ccc...dddddd"; Stri ...
- linux命令(25):ln命令
命令格式: ln [参数][源文件或目录][目标文件或目录] 必要参数: -b 删除,覆盖以前建立的链接 -d 允许超级用户制作目录的硬链接 -f 强制执行 -i 交互模式,文件存在则提示用户是否覆盖 ...
- cvs 日常使用
http://www.51testing.com/html/44/17144-2954.html http://www.chedong.com/tech/cvs_card.html
- SQL 分页通用存储过程
USE [DB] GO /****** Object: StoredProcedure [dbo].[SP_AspNetPager] Script Date: 10/23/2015 16:37:33 ...
- hdu 2686&&hdu 3376(拆点+构图+最小费用最大流)
Matrix Time Limit: 2000/1000 MS (Java/Others) Memory Limit: 32768/32768 K (Java/Others)Total Subm ...