先上效果:
代码:
日期选择时间选择:
基于jquery ui 1.11.4修改如下(在源码里面修改):
/* hide the date picker from view. * @param input element - the input field attached to the date picker */ _hidedatepicker: function(input) { var showanim, duration, postprocess, onclose, inst = this._curinst; if (!inst || (input && inst !== $.data(input, datepicker))) { return; } /** * 2015.6.11 修改 * author:link * 增加inst.autoclose控制日历面板 */// ----------------------------------------------------------------------------------------- if (this._datepickershowing||!inst.autoclose) { showanim = this._get(inst, showanim); duration = this._get(inst, duration); postprocess = function() { $.datepicker._tidydialog(inst); }; // deprecated: after bc for 1.8.x $.effects[ showanim ] is not needed if(inst.autoclose===true){ // 这里不隐藏 }else{ if ( $.effects && ( $.effects.effect[ showanim ] || $.effects[ showanim ] ) ) { inst.dpdiv.hide(showanim, $.datepicker._get(inst, showoptions), duration, postprocess); } else { inst.dpdiv[(showanim === slidedown ? slideup : (showanim === fadein ? fadeout : hide))]((showanim ? duration : null), postprocess); } }// -----------------------------------------------------------------------------------------if (!showanim) { postprocess(); } this._datepickershowing = false; onclose = this._get(inst, onclose); if (onclose) { onclose.apply((inst.input ? inst.input[0] : null), [(inst.input ? inst.input.val() : ), inst]); } this._lastinput = null; if (this._indialog) { this._dialoginput.css({ position: absolute, left: 0, top: -100px }); if ($.blockui) { $.unblockui(); $(body).append(this.dpdiv); } } this._indialog = false; } },
以上所述就是本文的全部内容了,希望大家能够喜欢。