手机时间选择插件 Jquery
// 时间选择
var currYear = (new Date()).getFullYear()
var opt_data = {
preset: 'date', //日期
theme: 'android-ics light', //皮肤其他参数【android-ics light】【android-ics】【ios】【jqm】【sense-ui】【wp light】【wp】
display: 'modal', //显示方式
mode: 'mixed', //操作方式【scroller】【clickpick】【mixed】
dateFormat: 'yy-mm-dd', // 日期格式
setText: '确定', //确认按钮名称
cancelText: '取消',//取消按钮名籍我
dateOrder: 'yymmdd', //面板中日期排列格式
yearText: '年', monthText: '月', dayText: '日', //面板中年月日文字
endYear:, //结束年份
showNow:true,
nowText:'今天',
hourText:'小时',
minuteText:'分',
startYear:currYear,
display:'bottom',//显示方式【modal】【inline】【bubble】【top】【bottom】
};
$("#demos").mobiscroll(opt_data); 插件的css和js http://files.cnblogs.com/xinlinux/mobiscroll.custom-2.13.2.min.css http://files.cnblogs.com/xinlinux/mobiscroll.custom-2.13.2.min.js
http://www.helloweba.com/
<!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>
<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
<!--<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/mobile/1.3.0/jquery.mobile-1.3.0.min.js"></script>-->
<!-- <link href="http://files.cnblogs.com/xinlinux/mobiscroll.custom-2.6.2.min.css" rel="stylesheet" type="text/css" /> -->
<link href="http://www.wglong.com/index/demos/mobiscroll/css/mobiscroll.custom-2.5.0.min.css" rel="stylesheet" type="text/css" />
<script src="http://www.wglong.com/index/demos/mobiscroll/js/mobiscroll.custom-2.5.0.min.js" type="text/javascript"></script> <link href="css/mobiscroll.custom-2.13.2.min.css" rel="stylesheet" type="text/css" />
<script src="js/mobiscroll.custom-2.13.2.min.js" type="text/javascript"></script> </head> <body>
<input id="demos" name="scroller" /> <script type="text/javascript">
var currYear = (new Date()).getFullYear()
var opt_data = {
preset: 'date', //日期
theme: 'android-ics light', //皮肤其他参数【android-ics light】【android-ics】【ios】【jqm】【sense-ui】【wp light】【wp】
display: 'modal', //显示方式
mode: 'mixed', //操作方式【scroller】【clickpick】【mixed】
dateFormat: 'yy-mm-dd', // 日期格式
setText: '确定', //确认按钮名称
cancelText: '取消',//取消按钮名籍我
dateOrder: 'yymmdd', //面板中日期排列格式
yearText: '年', monthText: '月', dayText: '日', //面板中年月日文字
endYear:, //结束年份
showNow:true,
nowText:'今天',
hourText:'小时',
minuteText:'分',
startYear:currYear,
display:'bottom',//显示方式【modal】【inline】【bubble】【top】【bottom】
};
$("#demos").mobiscroll(opt_data); /** $(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>
</body>
</html>
手机时间选择插件 Jquery的更多相关文章
- 9个最新的手机/移动设备jQuery插件
随着互联网的流行,移动网站开始急速增加,在2014年手机网站将会出现很多,所以手机网站是必须要学会制作的.手机网站不像桌面平台一样制作,否则会影响显示效果,目前大部分手机网站使用响应式设计技术,而且也 ...
- 最新的手机/移动设备jQuery插件
随着互联网的流行,移动网站开始急速增加,在2014年手机网站将会出现很多,所以手机网站是必须要学会制作的.手机网站不像桌面平台一样制作,否则会影响显示效果,目前大部分手机网站使用响应式设计技术,而且也 ...
- 轻量级jQuery语法高亮代码高亮插件jQuery Litelighter。
<!DOCTYPE html><html><head><meta charset="UTF-8" /><title>jQ ...
- 动态生成二维码插件 jquery.qrcode.js
前段时间做项目,需要动态生成一个二维码,于是就在网上找了一下发现一个jquery插件jquery.qrcode.js,所以今天就简单说一下这个插件的使用: jquery.qrcode.js是依赖jqu ...
- jQuery瀑布流插件——jQuery.Waterfall
插件--jQuery.Waterfall 思路: 其实只要了解了整个流程,要实现这个插件也不难,大家都玩过俄罗斯方块吧,原理差不多,找到合适的地方叠上去就好了,在这里,每个块的宽度是必需给定的,然后计 ...
- jQuery文件上传插件jQuery Upload File 有上传进度条
jQuery文件上传插件jQuery Upload File 有上传进度条 jQuery文件上传插件jQuery Upload File,插件使用简单,支持单文件和多文件上传,支持文件拖拽上传,有进度 ...
- [插件]jQuery multiselect初始化及默认值修改
下载地址:http://pan.baidu.com/s/1dE2daSD 1.Jquery多选下拉列表插件jquery multiselect功能介绍及使用 http://www.jb51.net/a ...
- jquery插件jquery.LightBox.js之点击放大图片并左右点击切换图片（仿相册插件）
该插件乃本博客作者所写,目的在于提升作者的js能力,也给一些js菜鸟在使用插件时提供一些便利,老鸟就悠然地飞过吧. 此插件旨在实现目前较为流行的点击放大图片并左右点击切换图片的效果,您可以根据自己的实 ...
- jQuery插件 -- 表单验证插件jquery.validate.js, jquery.metadata.js
原文地址:http://blog.csdn.net/zzq58157383/article/details/7718352 最常使用JavaScript的场合就是表单的验证,而jQuery作为一个 ...
随机推荐
- 多线程 Worker Thread 模式
Worker是“工人”的意思,worker thread pattern中,工人线程(worker thread)会一次抓一件工作来处理,当没有工作可做时,工人线程会停下来等待心得工作过来. Work ...
- C# .NET开发Oracle数据库应用程序
.NET Framework访问Oracle数据库至少有两种方式,一种是利用微软提供的ADO.NET,另一种是利用Oracle提供的ODP.NET. 安装VS的时候会附带ADO.NET,安装Oracl ...
- HTML父子页面通信问题（showModalDialog）
1. showModalDialog参数说明 window.showModalDialog(URL, ARGS,Features)(在父窗口中调用打开新的窗口) URL -- 必选 ...
- 错误 1 未能找到元数据文件“C:/WINDOWS/Microsoft.NET/Framework/v2.0.50727/Temporary ASP.NET Files/wwwroot/7cb4fcd
错误 1 未能找到元数据文件“C:/WINDOWS/Microsoft.NET/Framework/v2.0.50727/Temporary ASP.NET Files/wwwroot/7cb4fcd ...
- 64位CentOS安装32位开发环境编译Nachos
参考http://stackoverflow.com/questions/7412548/gnu-stubs-32-h-no-such-file-or-directory 1.On CentOS 5. ...
- RMQ——窗口题解
题目:窗口 描述: [问题描述] 给你一个长度为N的数组,一个长为K的滑动的窗体从最左移至最右端,你只能见到窗口的K个数,每次窗体向右移动一位,如下表: Window position Min val ...
- 《Linear Algebra and Its Applications》-chaper1-向量方程、矩阵方程和线性方程组
向量: 向量的基本运算:向量的运算最基本的一件事情,就是基于它n个分量上进行,即对于两个分量的向量a = <a1,a2>,b = <b1,b2>,有a + b = <a1 ...
- PS：改装店收的是友情价，包安装十五个毛主席。
糟糠之妻下堂,娇俏公主上位--更换宝马三系座椅作业 - 切诺基 Jeep家族 越野e族论坛 越野/SUV/旅行/赛事/改装/互动中心 PS:改装店收的是友情价,包安装十五个毛主席.
- Appcelerator Titanium 3.x Win7 64位平台安装步骤
刚接触Android移动开发,第一次下载Titanium,第一次下载ADT,第一次看Javascript代码,N多第一次...... 慢慢摸索了一个礼拜把移动开发的工具链的配置学习了一下,抛砖引玉,但 ...
- 初次使用cocoapods注意事项
在仅仅用cocoapods时可能会遇到各种各样的错误和问题 这里中总结下: 1.首先使用cocoapods有非常多优点,在github上非常多优秀的开源项目都用到了它;假设你不会使用它,那么非常多优秀 ...