Javascript Datepicker Pikaday: 增强版本

来源：互联网发布：淘宝店铺流量少的原因编辑：程序博客网时间：2024/04/29 23:25

Pikaday: 增强版本的Javascript Datepicker

本文转自[记录无限：www.gluoo.cn].

Github：https://github.com/dbushell/Pikaday

Pikaday

A refreshing JavaScript Datepicker

Lightweight (less than 5kb minified and gzipped)
No dependencies (but plays well with Moment.js)
Modular CSS classes for easy styling

Usage

Pikaday can be bound to an input field:

<input type="text" id="datepicker">

Add the JavaScript to the end of your document:

<script src="pikaday.js"></script><script>    var picker = new Pikaday({ field: document.getElementById('datepicker') });</script>

If you're using jQuery make sure to pass only the first element:

var picker = new Pikaday({ field: $('#datepicker')[0] });

If the Pikaday instance is not bound to a field you can append the element anywhere:

var field = document.getElementById('datepicker');var picker = new Pikaday({    onSelect: function(date) {        field.value = picker.toString();    }});field.parentNode.insertBefore(picker.el, field.nextSibling);

For advanced formatting load Moment.js prior to Pikaday: See the moment.js example for a full version.

<input type="text" id="datepicker" value="9 Oct 2014"><script src="moment.js"></script><script src="pikaday.js"></script><script>    var picker = new Pikaday({        field: document.getElementById('datepicker'),        format: 'D MMM YYYY',        onSelect: function() {            console.log(this.getMoment().format('Do MMMM YYYY'));        }    });</script>

0 0