最近在制作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手机触屏日期选择器的更多相关文章

  1. HTML5学习总结-09 拖放和手机触屏事件

    一 拖放 拖放(Drag 和 drop)是 HTML5 标准的组成部分.拖放是一种常见的特性,即抓取对象以后拖到另一个位置.在 HTML5 中,拖放是标准的一部分,任何元素都能够拖放. 课程参考 ht ...

  2. jQuery手机触屏拖动滑块验证跳转插件

    HTML: <!DOCTYPE html> <html lang="en"> <head> <title>jQuery手机触屏拖动滑 ...

  3. 手机触屏滑动图片切换插件swiper.js

    今天给大家分享一款手机触屏滑动图片切换插件swiper.js是一款swiper手机触屏滑动图片幻灯片,适合各种尺寸.效果图如下: 在线预览   源码下载 实现的代码. html代码: <div ...

  4. 手机触屏的js事件

    处理Touch事件能让你跟踪用户的每一根手指的位置.你可以绑定以下四种Touch事件:     1.touchstart:  // 手指放到屏幕上的时候触发      2.touchmove:  // ...

  5. jquery手机触屏滑动拼音字母城市选择器代码

    今天用到城市选择,直接用拼音滑动方式来选择,用的时候引入jquery(个别样式需要自己修改) <div class="yp_indz"><img src=&quo ...

  6. 手机触屏触摸特效javascript-TouchSwipe(依赖于jquery库)中文说明

    by 郑州seo on 2013 年 7 月 6 日 in jquery, 网站建设 with 6 Comments 最近需要做一个手机小门户网站,因为目前主流的手机都是安卓和苹果的,他们的浏览器内核 ...

  7. HTML5调用手机的Datepicker(日期选择器)

    HTML5 拥有多个新的表单输入类型.这些新特性提供了更好的输入控制和验证,包含了如下新的输入类型: email url number range Date pickers (date, month, ...

  8. jQuery手机触屏左右滑动切换焦点图特效代码

    原文地址:http://www.17sucai.com/pins/4857.html 演示地址:http://www.17sucai.com/pins/demoshow/4857 干净演示地址:htt ...

  9. css3实现各种渐变效果,比较适合做手机触屏版

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

随机推荐

  1. 常见网络命令之Ping命令

    前言:计算机网络老师要求我们自己总结一下常见的网络命,然后上课可以上去讲一下这些命令使用,像我这么听话的好学生,肯定是照老师要求,认真的总结了一下,总结的过程中,我发现网上已经有的资源讲的都不是很详细 ...

  2. KVM初始化过程

    转载:http://blog.csdn.net/dashulu/article/details/17074675 之前打算整理一下在Guest VM, KVM, QEMU中IO处理的整个流程,通过查阅 ...

  3. python基础===python实现截图

    python实现全屏截图: from PIL import ImageGrab im = ImageGrab.grab() im.save('F:\\12.png')

  4. 真正的上锁前,为何要调用preempt_disable()来关闭抢占的case【转】

    转自:http://blog.csdn.net/kasalyn/article/details/11473885 static inline void raw_spin_lock(raw_spinlo ...

  5. 图论-最小生成树-Kruskal算法

    有关概念: 最小生成树:在连通图G中,连接图G所有顶点且总权最小的边构成的树 思路: 首先对边按权从小到大排序,紧接着枚举每一条边,如果两个结点的祖先结点不同(并查集),则连上此边,直到边数等于结点数 ...

  6. 看懂sh脚本

    1 开头 程序必须以下面的行开始(必须方在文件的第一行): #!/bin/sh 符号#!用来告诉系统它后面的参数是用来执行该文件的程序.在这个例子中我们使用/bin/sh来执行程序. 当编写脚本完成时 ...

  7. 阿里云Centos等更新源设置成阿里源方法。

    https://help.aliyun.com/knowledge_detail/5974184.html ---------------------------------------------- ...

  8. kafka 设置消费者线程数

    http://blog.csdn.net/derekjiang/article/details/9053863 分布式发布订阅消息系统 Kafka 架构设计 - 目前见到的最好的Kafka中文文章 M ...

  9. Python五子棋的小程序

    代码是在开源中国上看到的,源代码网址:http://www.oschina.net/code/snippet_2365439_48010 需要安装graphics模块,下载地址:http://mcsp ...

  10. **极光推送PHP服务器端推送移动设备消息(Jpush V2 api)

    jpush.php  这是推送方法  用到curl发送请求 <?php /** * 极光推送php 服务器端 * @author yalong sun * @Email <syl_ad@1 ...