天天看點

【mark】datetimepicker 使用

導入包jquery.datetimepicker.js

1.Time區間選擇器

$(function() {

$(".startdatepicker").datetimepicker({

timeOnly:true,

datepicker:false,

step:5,

    format:'H:i',

onShow:function( currentDateTime ){

this.setOptions({

maxTime:$(".enddatepicker").val()?$(".enddatepicker").val():false

});

}

});

$(".enddatepicker").datetimepicker({

timeOnly:true,

datepicker:false,

step:5,

    format:'H:i',

onShow:function( currentDateTime ){

this.setOptions({

minTime:$(".startdatepicker").val()?$(".startdatepicker").val():false

});

}

});

});

2.DateTime區間選擇器

$(function() {

$(".startdatepicker").datetimepicker({

showSecond: true,

    format:'Ymd H:i:s',

    formatDate:'Ymd H:i:s',

onShow:function( currentDateTime ){

this.setOptions({

maxDate:$(".enddatepicker").val()?$(".enddatepicker").val():false

});

}

});

$(".enddatepicker").datetimepicker({

showSecond: true,

    format:'Ymd H:i:s',

    formatDate:'Ymd H:i:s',

onShow:function( currentDateTime ){

this.setOptions({

minDate:$(".startdatepicker").val()?$(".startdatepicker").val():false

});

}

});

});

繼續閱讀