JQuery手机版日期选择控件之jdate(jquery-date)

一、控件说明 jdate(jquery-date)

注：当前控件兼容支持手机浏览器，常用选择即可支持。

git源代码地址：

https://github.com/weijhfly/jqueryDatePlugin

如果是在vue或其他模块开发的项目中，参考git中的使用说明。

在html中使用，比较简单，引用jquery控件后，再引用jdate控件

使用使用方法很简单：

    var jd = new Jdate({
            el: '#dateOne',
            format: 'YYYY-MM-DD',
        });

使用效果：

 

二、使用示例

    

        日期
        
        日期格式：yyyy-MM-dd
    
    Submit

官方示例：

//完整参数、方法示例
var jd = new Jdate({
    el: '#date',
    format: 'YYYY-MM-DD',
    beginYear: 2000,
    endYear: 2100,
    minStep:1,
    lang:{title:'自定义标题'},
    trigger:'tap',
    init: function() {
      console.log('插件开始触发');
    },
    moveEnd: function() {
      console.log('滚动结束');
    },
    confirm: function(date) {
      console.log('确定按钮触发');
    },
    cancel: function() {
      console.log('插件运行取消');
    }
})
jd.show();
jd.hide();

 

参数、方法说明

名称	必填	默认值	说明
el	是	无	绑定插件的dom元素，插件内部使用document.querySelector， 也可以直接传递dom元素对象，只支持单个
format	否	'YYYY-MM-DD'	日期格式，无限制。规则：年-YYYY 月-MM 日-DD 时-hh 分-mm 秒-ss 使用/、-、空格、:之一分隔，可随意组合
beginYear	否	2000	日期开始年份
endYear	否	2100	日期结束年份
value	否	无	日期初始化的默认值，列如'2018-03-18'
lang	否	年、月、日...	配置插件语言，默认：title:'选择日期',cancel:'取消',confirm:'确认', year:'年',month:'月',day:'日',hour:'时',min:'分',sec:'秒'
minStep	否	1	分钟按指定数分隔
init	否	null	插件触发前的回调函数，return false可阻止插件执行
moveEnd	否	null	插件滚动后的回调函数
confirm	否	null	确认按钮触发前的回调函数，return false可阻止插件执行， return其他值可修改日期，函数返回一个参数(选中的日期)
cancel	否	null	插件取消时触发的回调函数
trigger	否	'tap'	默认使用tap解决移动端click事件300ms延迟，可选click替换tap。注意使用tap会阻止其他绑定的click事件的触发
show	否	无	主动触发插件，当trigger为tap时，主动触发插件应该使用此方法
hide	否	无	主动隐藏插件

 

更多：

Bootstrap3 datetimepicker控件的使用

Bootstrap Table使用整理（六）-常用操作

Bootstrap相关整理、免费主题整理