自定义jquery ui日历 自定义的jquery ui组件开发的日历控件,和系统配置支持变更语言,变更时间格式,切换时区 $(function() { jQuery.widget("xway.Calendar", { _div : null, hide : function() { jQuery(document).off("mouseup"); this._div.fadeOut(); }, pickup : function(value) { this.hide(); this.element.val(value); }, load : function(value) { if (typeof(value) == "undefined" || value == null) value = ""; this._div.load("Calendar.do?d=" + value); }, options: { value : null }, _create: function() { this._div = jQuery("<div></div>"); this._div.insertAfter(this.element); this._div.css("display", "none"); this._div.css("position", "absolute"); this._div.css("z-index", "999"); this._div.css("background", "#eeeeee"); this._div.css("border", "1px groove "); this._div.css("overflow" , "hidden"); this._div.css("left", this.element.position().left + this.element.outerWidth()); this._div.css("top", this.element.position().top); this._div.css("width", "260"); this._div.css("height", "290"); }, _init: function() { this._div.data("calendar", this); this.load(this.element.val()); this._div.fadeIn(); jQuery(document).on("mouseup", null, this, function(event) { var event = event || window.event; var obj = event.data; var elm = event.data._div; if (!elm.is(event.target) && elm.has(event.target).length == 0) { obj.hide(); } }); }, _destroy: function() { alert(1); this._super(); this.element.next().remove(); }, _setOption: function( key, value ) { if (key == "input" && value == null) { return ; } this._super( key, value ); } }); }) 显示如下图: 左边是 mm/dd/yyyy中文,右边是yyyy-mm-dd英文
版权声明:本文为博主原创文章,未经博主允许不得转载。 |