时间控件的使用说明和演示

在网上看到一个不错的时间控件,叫Pikaday,用起来还是很不错的, 不管是界面, 还是方便上,所以特意放在博客上, 以后用的时候方便,本控件使用很简单。

1.在头里面引入需要的文件

需要的文件包含两个,一个js文件,一个css文件,代码:

<link rel=”stylesheet” type=”text/css” href=”./css/pikaday.css”/>
<script type=”text/javascript” src=”./js/pikaday.min.js”></script>

 

2.在内容里面使用

<input type=”text” id=”datepicker” />

<script type=”text/javascript”>

var picker = new Pikaday(

{

field: document.getElementById(‘datepicker’),

firstDay: 1,

minDate: new Date(’2010-01-01′),

maxDate: new Date(’2020-12-31′),

yearRange: [2000,2020]

});

</script>

然后就可以看到效果了,效果演示地址:

http://www.cangzhang.com/wp-content/uploads/Pikaday/index.html

截图效果:

20131015212425

文件包下载地址:Pikaday

共有 0 条评论

Top