作者:一巴掌呼死你 | 来源:互联网 | 2023-06-10 12:00
1.控件收集比较常用的是功能丰富的My97DatePicker,缺点是界面效果一般。jquery时间插件目前插件有很多种类,有的支持两个日期栏,有的带农历,带节假日,
1.控件收集
比较常用的是功能丰富的My97DatePicker,缺点是界面效果一般。
jquery时间插件
目前插件有很多种类,有的支持两个日期栏,有的带农历,带节假日,带时间,带钟表显示,html5响应式时间轴页面。
比较小的一个日期选择器Pickday,不依赖任何Javascript库,并且文件只有5K(目前加了一些扩展,达到11K左右),有人已经修改成中文版的Pikaday中文版(如果地址不能访问,可以用goolge搜索),我们下面实践的就是这个插件。
2.实践
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta charset="utf-8" />
<title>picker时间控件title>
<link rel="stylesheet" type="text/css" href="css/pikaday.css"/>
<script type="text/Javascript" src="js/pikaday.min.js">script>
head>
<body>
<input type="text" id="datepicker1" />
<input type="text" id="datepicker2" />
<script type="text/Javascript"> var picker1 = new Pikaday( { field: document.getElementById('datepicker1'), firstDay: 1, minDate: new Date('2010-01-01'), maxDate: new Date('2020-12-31'), yearRange: [2000,2020] }); var picker2 = new Pikaday( { field: document.getElementById('datepicker2'), firstDay: 1, minDate: new Date('2010-01-01'), maxDate: new Date('2020-12-31'), yearRange: [2000,2020] }); var date1 = document.getElementById('datepicker1').val(); var date2 = document.getElementById('datepicker2').val(); if(date1>date2){ alert('截至时间应该大于开始时间'); return; } script>
body>
html>