采用jqueryUI创建日期选择器
该公司的项目使用的插件时间选择,百度很长一段时间。没有找到合适的,而且,他们在看了jqueryUI。自己变成一个更好的集成日期选择器。为了以后遇到相同的问题是可以解决。
以下就贴出部分使用的代码,比較简单,可是非常有用!!!
<!doctype html>
<html lang="en"> <head>
<meta charset="utf-8">
<title>jQuery UI 日期选择器(Datepicker) - 默认功能</title>
<link rel="stylesheet" href="//code.jquery.com/ui/1.10.4/themes/smoothness/jquery-ui.css">
<script src="//code.jquery.com/jquery-1.9.1.js"></script>
<script src="//code.jquery.com/ui/1.10.4/jquery-ui.js"></script>
<link rel="stylesheet" href="http://jqueryui.com/resources/demos/style.css">
<!-引入jqueryUI的相关文件-->
<style>
#draggable {
width: 150px;
height: 150px;
padding: 0.5px;
border: 1px solid #F00
}
</style>
<script>
$(function() {
$("#datepicker").datepicker({
showOtherMonths: true,
selectOtherMonths: true,
showButtonPanel: true,
/*显示今天的日期的显示。以及关闭时间选择器*/
changeMonth: true,
/*显示选择其它月份*/
changeYear: true,
/*显示选择其它年份*/
dateFormat: "yy - mm - dd" /*设置日期的显示格式*/ ,
showWeek: true,/*显示一年中的第几周*/
firstDay: 1
})
});
</script>
</head>
<body>
<p>日期:
<input type="text" id="datepicker">
</p>
</body> </html>
关于JqueryUI的datepicker选择器的其它部分属性能够通过以下的链接查看:
jQuery UI API - 日期选择器部件
版权声明:本文博主原创文章,博客,未经同意不得转载。
采用jqueryUI创建日期选择器的更多相关文章
- Flex 日期选择器控件
在构建用户界面时,经常用到日期的输入和选择. 输入日期时,用户可以使用键盘输入,也可以在类似于日历的弹出式对话框中,通过鼠标单击所选日期. 在Flex中可以通过日期输入控件实现输入和选择日期.Flex ...
- 安卓 Pickers(选择器)
概述 安卓提供了现成的对话框,让用户选择一个时间或日期.每一个选择器控制时间(小时,分钟,AM/PM)或日期(月,日,年)的每一部分的选择.使用这些选择器帮助 确保用户正确的,格式化的,和适合的选择一 ...
- JQuery高性能优化
使用JQuery时,你可以使用多种选择器,选择同一个元素,各种方法之间的性能是不一样的,有时候差异会特别大. 通常比较常用的选择器有以下几个: ID选择器 $("#id") 标签选 ...
- JQuery高性能最佳实践
[使用最佳选择器] 使用JQuery时,你可以使用多种选择器,选择同一个元素,各种方法之间的性能是不一样的,有时候差异会特别大. 通常比较常用的选择器有以下几个: ID选择器 $("#id& ...
- css: hide or dispaly div
<!DOCTYPE html> <html> <head><meta http-equiv="Content-Type" content= ...
- CSS清除浮动
今天看到一篇文章关于清除浮动的,突然间脑袋短路了,咦?为什么要清除浮动?原谅我的无知,搜了下原来是这样,又倒腾出原来的笔记,唉,本来就有记录啊,而且也会经常用到,用的久了连原理都忘了.恩,防止自己再犯 ...
- php-css外边距
css 基本语法 selector{declaration1;declaration2;....delecrationN;} (选择器和一条或多条声明) 选择器为需要改变样式的html元素,每条声 ...
- jquery 实践总结
Ready事件 对DOM操作之前需要监听页面加载进度,应当在页面加载完成之后再执行DOM编辑操作. $(document).ready(function(){ ... }); 或者 $(functio ...
- iOS开发——UI篇Swift篇&UIDatePicker
UIDatePicker //返回按钮事件 @IBAction func backButtonClick() { self.navigationController?.popViewControlle ...
随机推荐
- [Android学习笔记]SeekBar的使用
一.SeekBar滑动条的使用 xml声明: <SeekBar android:id="@+id/seekbar" android:layout_width="20 ...
- 用Python对体积较大的CSV文件进行比较的经验
用Python对体积较大的CSV文件进行比较的经验 » 进化的测试 | 进化的测试 用Python对体积较大的CSV文件进行比较的经验 python Add comments 八 032010 ...
- SuSE(SLES)安装配置syslog-ng日志server,可整合splunk
Update History 2014年04月25日 - 撰写初稿 引言 在自己主动化部署AutoYast.自己主动化监控BMC Patrol双方面形成雏形后.日志的收集.管理.分析也顺势成为我们须要 ...
- hdu5171(矩阵快速幂)
传送门:GTY's birthday gift 题意:GTY的朋友ZZF的生日要来了,GTY问他的基友送什么礼物比较好,他的一个基友说送一个可重集吧!于是GTY找到了一个可重集S,GTY能使用神犇魔法 ...
- Loser应该知道的6个残酷人生事实(血泪翻译)
Loser应该知道的6个残酷人生事实(血泪翻译) - Acfun - 天下漫友是一家 Loser应该知道的6个残酷人生事实(血泪翻译)
- Linux中下载,压缩,解压等命令
查看是否和还有一台Linux机器相通命令:ssh 主机名@Ip地址 ,提示输入password.就可以查看远程文件的文件夹 下载远程机器上的文件:scp 主机名@Ip地址:/path/s ...
- fastdfs storage server的设计与实现
fastdfs是一个针对互联网应用设计的分布式文件系统.具有架构简单.结构清晰.代码量小等特点. 详细的介绍及架构请參考分布式文件系统FastDFS架构剖析(http://www.program ...
- net 面向接口框架
Asp.net 面向接口框架之应用程序上下文作用域组件 在团队中推广面向接口开发两年左右,成果总体来说我还是挺满意的,使用面向接口开发的模块使用Unity容器配置的功能非常稳定,便于共享迁移(另一个项 ...
- ReentrantLock可重入锁的使用场景(转)
摘要 从使用场景的角度出发来介绍对ReentrantLock的使用,相对来说容易理解一些. 场景1:如果发现该操作已经在执行中则不再执行(有状态执行) a.用在定时任务时,如果任务执行时间可能超过下次 ...
- selenium + firefox/chrome/phantomjs登陆之模拟点击
登陆之模拟点击 工具:python/java + selenium + firefox/chrome/phantomjs (1)windows开发环境搭建 默认已经安装好了firefox 安装pip ...