JavaScript plugin: Quick Select date----Jedate Calendar plugin

Source: Internet
Author: User

Jedate is a lightweight Js library that allows you to quickly select a date http://www.sucaijiayuan.com/Js/DateTime/1371.html

How to use:

Download jedate, do not change the directory structure within the folder, and then introduce the Jedate.js file,

<id= "DatePicker"  placeholder= "Please select time"  type= " Text "  readonly/>
varDatepickeroptions ={datecell:"#datepicker",//The target element. Because the jedate.js encapsulates a lightweight selector, Datecell also allows you to pass in class, tag in a way that ' #id. class 'Format: "Yyyy-mm-dd hh:mm:ss",//Date FormatMinDate: "1900-01-01 00:00:00",//Minimum DateMaxDate: "2099-12-31 23:59:59",//Maximum DateIsinitval:false,//whether to initialize timeIstime:true,//whether to turn on time selectionIsclear:true,//whether to display emptyFestivalfalse,//whether to show festivalszindex:999,//level height of the popup layerMarksNULL,//give a date a labelChoosefun:function(Val) {},//callbacks after the selected dateClearfun:function(Val) {},//callback after the date is clearedOkfun:function(Val) {}//Click on the callback after OK};jedate (datepickeroptions);

Notice the points:

1.

// The target element. Because the jedate.js encapsulates a lightweight selector, Datecell also allows you to pass in class, tag in a way that ' #id. class '

Specifies the DOM to populate the date with

2.

// Date Format

Returns the date format, which causes different calendar interfaces, such as:

"YYYY-MM"

"Yyyy-mm-dd"

"Yyyy-mm-dd hh:mm:ss" simultaneously set istime:true, turn on time selection

A common requirement is to choose a time format, so set up a function to pass in three main parameters:

/***datepickerinit.js Widgets Use Prerequisites-----Introduce Jquery-1.11.3.js Jedate.js*domid: The ID of a DOM element that needs to be populated with a date such as an input Id*format: Formats that need to be populated with dates such as "Yyyy-mm-dd hh:mm:ss" "Yyyy-mm-dd hh:00:00" "Yyyy-mm-dd hh:59:59" "YYYY year mm DD day hh" mm min ss seconds "*istime: whether to turn on time selection * */functiondatepickerinit (domid, format, istime) {varDatepickeroptions ={datecell:"#" + Domid,//The target element. Because the jedate.js encapsulates a lightweight selector, Datecell also allows you to pass in class, tag in a way that ' #id. class 'Format:format,//Date Format    //mindate: "1900-01-01 00:00:00",//Minimum date    //maxdate: "2099-12-31 23:59:59",//maximum dateIsinitval:false,//whether to initialize timeIstime:istime,//whether to turn on time selectionIsclear:true,//whether to display emptyFestivalfalse,//whether to show festivalszindex:999,//level height of the popup layerMarksNULL,//give a date a labelChoosefun:function(Val) {},//callbacks after the selected dateClearfun:function(Val) {},//callback after the date is clearedOkfun:function(Val) {}//Click on the callback after OK  }; Jedate (datepickeroptions);}

You can easily set the DOM elements to populate

$ (function() {      datepickerinit (true);});

JavaScript plugin: Quickly select date----Jedate Calendar plugin

Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.