不说多的，直接看代码
<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="gbk">

    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=0">

    <title>Mobiscroll</title>

    <link rel="stylesheet" href="http://code.jquery.com/mobile/1.3.0/jquery.mobile-1.3.0.min.css" />

    <script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>

    <script src="http://code.jquery.com/mobile/1.3.0/jquery.mobile-1.3.0.min.js"></script>

    <!--Includes-->

    <link href="css/mobiscroll.custom-2.5.0.min.css" rel="stylesheet" type="text/css" />

    <script src="js/mobiscroll.custom-2.5.0.min.js" type="text/javascript"></script>

    <script type="text/javascript">

  $(function(){

    var opt = {

        preset: 'date', //日期

        theme: 'sense-ui', //皮肤样式

        display: 'modal', //显示方式

        mode: 'scroller', //日期选择模式

        dateFormat: 'yy-mm-dd', // 日期格式

        setText: '确定', //确认按钮名称

        cancelText: '取消',//取消按钮名籍我

        dateOrder: 'yymmdd', //面板中日期排列格式

        dayText: '日', monthText: '月', yearText: '年', //面板中年月日文字

        endYear:2020 //结束年份

    };

    $("#scroller").mobiscroll(opt).date(opt);

    //之前给群里共享发错了。记得之前写过一个，估计丢了。现在重写一个。并完善一下，下面注释部分是上面的参数可以替换改变它的样式

    //希望一起研究插件的朋友加我个人QQ也可以，本人也建个群 291464597 欢迎进群交流。哈哈。这个不能算广告。

    // 直接写参数方法

    //$("#scroller").mobiscroll(opt).date();

    // Shorthand for: $("#scroller").mobiscroll({ preset: 'date' });

    //具体参数定义如下

    //{

    //preset: 'date', //日期类型--datatime,

    //theme: 'ios', //皮肤其他参数【android-ics light】【android-ics】【ios】【jqm】【sense-ui】【sense-ui】【sense-ui】

                                //【wp light】【wp】

    //mode: "scroller",//操作方式【scroller】【clickpick】【mixed】

    //display: 'bubble', //显示方【modal】【inline】【bubble】【top】【bottom】

    //dateFormat: 'yyyy-mm-dd', // 日期格式

    //setText: '确定', //确认按钮名称

    //cancelText: '清空',//取消按钮名籍我

    //dateOrder: 'yymmdd', //面板中日期排列格

    //dayText: '日',

    //monthText: '月',

    //yearText: '年', //面板中年月日文字

    //startYear: (new Date()).getFullYear(), //开始年份

    //endYear: (new Date()).getFullYear() + 9, //结束年份

    //showNow: true,

    //nowText: "明天",  //

    //showOnFocus: false,

    //height: 45,

    //width: 90,

    //rows: 3}

});

    </script>

</head>

<body>

<input id="scroller" name="scroller" />   

亲们，觉得日期界面不漂亮，看代码。我都写上每个参数的具体注释了。再看不懂，我也没办法了。

</body>

</html>

插件文档参考地址：https://docs.mobiscroll.com/2-5-2/calendar#opt-marked

附上代码:
mobiscroll-2.5.2-IncreasedChineseSupport.zip
PluginDatetime.zip

jquery移动端日期插件的更多相关文章

  1. jquery ui bootstrap日期插件

    http://blog.csdn.net/php_897721669/article/details/7404527 搜索“jquery ui日期插件怎么显示年份”? $("#datepic ...

  2. jquery mobile mobiscroll 日期插件使 用mobiscroll

    官网网站: http://www.mobiscroll.com/ http://code.google.com/p/mobiscroll/ 1.精简版Demo: 查看Demo » 下载Demo » 2 ...

  3. jquery——移动端滚动条插件iScroll.js

    官网:http://cubiq.org/iscroll-5 demo: 滚动刷新:http://cubiq.org/dropbox/iscroll4/examples/pull-to-refresh/ ...

  4. Bootstrap日期插件中文实现

    Bootstrap的相关JS和CSS直接跳过. <script type="text/javascript" src="static/js/jquery-1.9.1 ...

  5. 基于zepto的移动端轻量级日期插件

    前言 做过移动Web开发的同学都知道,移动端日期选择是很常见的需求.在PC端,我们有很丰富的选择,比较出名的就有Mobiscroll和jQuery UI Datepicker.个人看来,这些插件存在的 ...

  6. jquery mobiscroll移动端日期选择控件(无乱码)

    jquery mobiscroll移动端日期选择控件(无乱码) <pre><!DOCTYPE html><html lang="en">< ...

  7. 基于zepto的移动端日期+时间选择插件

    前段时间写了两个移动端的日期选择插件:轻量级移动端日期选择器,本来是为特定的场景中使用的,结果有同学反应不够灵活和强大.虽然我的看法是移动端的界面要尽可能简洁,功能要尽可能简单,但是难免还是会有各种各 ...

  8. (转)jQuery Mobile 移动开发中的日期插件Mobiscroll 2.3 使用说明

    (原)http://www.cnblogs.com/hxling/archive/2012/12/12/2814207.html jQuery Mobile 移动开发中的日期插件Mobiscroll ...

  9. jQuery Mobile 移动开发中的日期插件Mobiscroll使用说明

    近期在移动方面的开发,使用jQuery Mobile ,移动方面的插件不如Web 方面的插件多,选择的更少,有一些需要自己去封装,但功力尚不足啊. 日期插件JQM也提供了内置的,但样式方面不好看,只好 ...

随机推荐

  1. ListView中itemz中控件的点击事件和条目点击事件冲突

    <?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android=&quo ...

  2. C++ Primer : 第十三章 : 拷贝控制之对象移动

    右值引用 所谓的右值引用就是必须将引用绑定到右值的引用,我们通过&&来绑定到右值而不是&, 右值引用只能绑定到即将销毁的对象.右值引用也是引用,因此右值引用也只不过是对象的别名 ...

  3. AJAX部分---php-jquery-ajax；

    AJAX的应用场景 1.异步搜索过滤内容数据 2.表单异步验证 3.异步加载页面“更多”数据 4.异步处理登录 5.异步处理用户名是否注册 AJAX的主要特点 1.在不刷新页面的情况下,与服务器进行异 ...

  4. Objective－c——UI基础开发第十一天（UICollectionView）

    一.知识点 1.UICollectionView的dataSource .delegate 2.UICollectionView多组数据和单组数据的展示 3.UICollectionView.UICo ...

  5. 关于java 中文乱码问题 自己的一点解决方案

    早上做导出的时候,url拼接参数中文出现了乱码.查了半天.终于中午搞定了. 在web.xml中加了转码过滤器,tomcat的server.xml中也加入URIEncoding="UTF-8& ...

  6. win10 64bits信捷触摸屏download usb口驱动程序的安装

    [问题描述] win10 64bits,信捷触摸屏开发软件,下载的时候需要安装驱动程序. 用的以前的win7 64bits的驱动程序,直接双击安装,显示无法操作注册表,需要管理员模式. 使用管理员权限 ...

  7. [洛谷OJ] P1114 “非常男女”计划

    洛谷1114 “非常男女”计划 本题地址:http://www.luogu.org/problem/show?pid=1114 题目描述 近来,初一年的XXX小朋友致力于研究班上同学的配对问题(别想太 ...

  8. MSSQL FOR MXL PATH 运用(转载)

    FOR XML PATH 有的人可能知道有的人可能不知道,其实它就是将查询结果集以XML形式展现,有了它我们可以简化我们的查询语句实现一些以前可能需要借助函数活存储过程来完成的工作.那么以一个实例为主 ...

  9. 【netty】Netty系列之Netty百万级推送服务设计要点

    1. 背景 1.1. 话题来源 最近很多从事移动互联网和物联网开发的同学给我发邮件或者微博私信我,咨询推送服务相关的问题.问题五花八门,在帮助大家答疑解惑的过程中,我也对问题进行了总结,大概可以归纳为 ...

  10. 使用C#对SQLLite进行操作

    1.数据库连接(常用连接方法,示例) 1). 添加引用: System.Data.SQLite.DLL .2). 打开或创建数据库文件: SQLiteConnection.CreateFile(fil ...