js简单日期选择插件

js简单日期选择插件源码下载

看看谁在用

查看文件目录结构

文件大小:0.03M

素材分类: 插件- 时间

更新时间:2020-12-23

一款开发人员友好的js简单日期选择插件,可以自定义很容易二次开发。JavaScript原生代码开发的日期选择插件。
const input = document.getElementById('example');
const datepicker = new TheDatepicker.Datepicker(input);
datepicker.render();
// set initial date
datepicker.options.setInitialDate();

// set initial month
datepicker.options.setInitialMonth();

// hide on blur
datepicker.options.setHideOnBlur();

// hide on select
datepicker.options.setHideOnSelect();

// set date format, e.g. j. n. Y
datepicker.options.setInputFormat();

// set the first day of week
datepicker.options.setFirstDayOfWeek();

// set min/max dates
datepicker.options.setMinDate();
datepicker.options.setMaxDate();

// limits the year selection
datepicker.options.setDropdownItemsLimit(1900, 2100);

// show/hide days when out of month
datepicker.options.setDaysOutOfMonthVisible();

// fixed rows count
datepicker.options.setFixedRowsCount();

// toggle selection
datepicker.options.setToggleSelection();

// show Deselect button
datepicker.options.setShowDeselectButton();

// show Close button
datepicker.options.setShowCloseButton();

// show Reset button
datepicker.options.setShowResetButton();

// allow empty
datepicker.options.setAllowEmpty();

// set title
datepicker.options.setTitle();

// show month picker as a dropdown
datepicker.options.setMonthAsDropdown();

// show year picker as a dropdown
datepicker.options.setYearAsDropdown();

datepicker.options.setMonthAndYearSeparated();
datepicker.options.setPositionFixing();

datepicker.options.setDateAvailabilityResolver((date) => {
  // return true;
});

datepicker.options.setCellContentResolver((day) => {
  // return day.dayNumber;
});

datepicker.options.addCellClassesResolver((day) => {
  // if (day.dayNumber === 20) return ['red'];
  // if (day.dayNumber === 10) return ['green'];
  return [];
});

datepicker.options.addDayModifier((day) => {
  // day.isSunday = day.dayOfWeek === TheDatepicker.DayOfWeek.Sunday;
});

datepicker.options.setCellClassesResolver((day) => {
  // return [];
});

datepicker.options.onBeforeSelect((event, day, previousDay) => {
  // callback
});

datepicker.options.onSelect((event, day, previousDay) => {
  // callback
});

datepicker.options.onBeforeSwitch((event, isOpening) => {
  // callback
});

datepicker.options.onSwitch((event, isOpening) => {
 // callback
});

datepicker.options.onBeforeGo((event, month, previousMonth) => {
  // callback
});

datepicker.options.onGo((event, month, previousMonth) => {
  // callback
});

// set prefix
datepicker.options.setClassesPrefix();

// set go back HTML
datepicker.options.setGoBackHtml();

// set go forward HTML
datepicker.options.setGoForwardHtml();

// set close HTML
datepicker.options.setCloseHtml();

// set reset HTML
datepicker.options.setResetHtml();

// set deselect HTML
datepicker.options.setDeselectHtml();

js简单日期选择插件

正在加载文件目录...

ラビットハンター
ラビットハンター下载了 此素材
涵
下载了 此素材
Super曹亚美
Super曹亚美收藏了 此素材
Super曹亚美
Super曹亚美下载了 此素材
倒吊人
倒吊人下载了 此素材
土木
土木下载了 此素材
maysky
maysky下载了 此素材
病入膏肓
病入膏肓下载了 此素材
3dfx
3dfx下载了 此素材
睡觉
睡觉下载了 此素材

也许你还喜欢

  1. xvCalendar.js时间日期选择插件
  2. 两个日期范围选择JS插件
  3. jquery日历插件自适用手机端
  4. jquery输入框日期选择插件
  5. 日期选择Js插件
  6. js简约日期选择插件date-selector
  7. Js单双日历插件日期范围选择
  8. jquery手机滑动选择日期插件mobileSelect
canvas星际穿越h5动画背景特效
  • 标签大全|网站地图|关于我们|用户协议
  • 背景样式编辑器|按钮样式编辑器|背景动效编辑器|图片布局编辑器|在线工具