zoukankan      html  css  js  c++  java
  • 采用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 {
    				 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 - 日期选择器部件


    
    

    版权声明:本文博主原创文章,博客,未经同意不得转载。

  • 相关阅读:
    COF框架集成mongodb驱动
    在 RedHat Enterprise、CentOS 或 Fedora Linux 上安装 MongoDB
    利用RATF框架实现web状态的监控
    利用接口测试框架实现web状态的监控
    uwsgi配置
    NODE_ENV&&cross-env的使用
    局部安装的webpack怎么通过npm脚本执行
    react
    .gitignore无法忽略部分文件/文件夹
    MongoDB
  • 原文地址:https://www.cnblogs.com/blfshiye/p/4834818.html
Copyright © 2011-2022 走看看