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. Select三级下拉日期时间选择JS插件
  2. jQuery滚动选择日期日历插件
  3. jQuery弹出式日期和时间选择插件
  4. 日期选择Js插件
  5. 炫酷Bootstrap和材料设计日历时间选择插件
  6. Bootstrap弹出时钟日期时间选择插件
  7. angularjs日期时间选择插件
  8. jQuery自定义日历事项查看插件
canvas星际穿越h5动画背景特效
  • 标签大全|网站地图|关于我们|用户协议
  • 背景样式编辑器|按钮样式编辑器|背景动效编辑器|在线工具