我的扩展EXT时间控件，可以选择到时分

Ext.ux.form.DateTimePicker:

//不能单据使用，必先引用 Ext.ux.form.Spinner
Ext.ns('Ext.ux.form');
Ext.ux.form.DateTimePicker = function(config) {
	Ext.ux.form.DateTimePicker.superclass.constructor.call(this, config);
};

Ext.extend(Ext.ux.form.DateTimePicker, Ext.DatePicker, {
	hourText:'时',
	minuteText:'分',
	spinnerCfg : {
		width : 40
	},
    initComponent : function(){
        Ext.DatePicker.superclass.initComponent.call(this);
        this.value = this.value ?this.value : new Date();
        this.addEvents(
            'select'
        );
        if(this.handler){
            this.on("select", this.handler,  this.scope || this);
        }
        this.initDisabledDays();
    },
	selectToday : function() {
		this.setValue(new Date());
		this.value.setHours(this.theHours);
		this.value.setMinutes(this.theMinutes);
		this.fireEvent("select", this, this.value);
	},
	handleDateClick : function(e, t) {
		e.stopEvent();
		if (t.dateValue && !Ext.fly(t.parentNode).hasClass("x-date-disabled")) {
			this.value = new Date(t.dateValue);
			this.value.setHours(this.theHours);
			this.value.setMinutes(this.theMinutes);
			this.setValue(this.value);
			this.fireEvent("select", this, this.value);
		}
	},
	onRender : function(container, position) {
		var m = ['<table cellspacing="0" width="200px">', '<tr><td colspan="3"><table cellspacing="0" width="100%"><tr><td class="x-date-left"><a href="#" title="', this.prevText,
				'"> </a></td><td class="x-date-middle" align="center"></td><td class="x-date-right"><a href="#" title="', this.nextText, '"> </a></td></tr></table></td></tr>',
				'<tr><td colspan="3"><table class="x-date-inner" cellspacing="0"><thead><tr>'];
		var dn = this.dayNames;
		for (var i = 0; i < 7; i++) {
			var d = this.startDay + i;
			if (d > 6) {
				d = d - 7;
			}
			m.push("<th><span>", dn[d].substr(0, 1), "</span></th>");
		}
		m[m.length] = "</tr></thead><tbody><tr>";
		for (i = 0; i < 42; i++) {
			if (i % 7 === 0 && i !== 0) {
				m[m.length] = "</tr><tr>";
			}
			m[m.length] = '<td><a href="#" hidefocus="on" class="x-date-date" tabIndex="1"><em><span></span></em></a></td>';
		}

		m[m.length] = '</tr></tbody></table></td></tr><tr><td class="minutecss"><table cellspacing="0" ><tr>';
		m[m.length] = '<td class="x-hour"></td><td>'+this.hourText+'</td><td width ="5px"></td><td class="x-minute"></td><td>'+this.minuteText+'</td>';
		m[m.length] = '</tr></table></td><td  colspan="2" class="x-date-bottom" align="center"></td></tr></table><div class="x-date-mp"></div>';

		var el = document.createElement("div");
		el.className = "x-date-picker";
		el.innerHTML = m.join("");

		container.dom.insertBefore(el, position);

		this.el = Ext.get(el);
		this.eventEl = Ext.get(el.firstChild);

		new Ext.util.ClickRepeater(this.el.child("td.x-date-left a"), {
			handler : this.showPrevMonth,
			scope : this,
			preventDefault : true,
			stopDefault : true
		});

		new Ext.util.ClickRepeater(this.el.child("td.x-date-right a"), {
			handler : this.showNextMonth,
			scope : this,
			preventDefault : true,
			stopDefault : true
		});

		var cfg = Ext.apply({}, this.spinnerCfg, {
			readOnly : this.readOnly,
			disabled : this.disabled,
			align : 'right',
			selectOnFocus : true,
			listeners : {			
				spinup : {
					fn : this.onSpinnerChange,
					scope : this
				},
				spindown : {
					fn : this.onSpinnerChange,
					scope : this
				},
				change : {
					fn : this.onSpinnerChange,
					scope : this
				},

				afterrender : {
					fn : function(spinner) {
						spinner.wrap.applyStyles('float: left');
					},
					single : true
				}
			}
		});
		this.hoursSpinner = new Ext.ux.form.Spinner(Ext.apply({}, cfg, {
			renderTo:this.el.child("td.x-hour", true),
			strategy : new Ext.ux.form.Spinner.NumberStrategy({
				minValue : 0,
				maxValue : 23
			}),	
			cls : 'first',
			value : this.theHours
		}));
		this.minutesSpinner = new Ext.ux.form.Spinner(Ext.apply({}, cfg, {
			renderTo:this.el.child("td.x-minute", true),
			strategy : new Ext.ux.form.Spinner.NumberStrategy({
				minValue : 0,
				maxValue : 59
			}),				
			value : this.theMinutes
		}));

		this.eventEl.on("mousewheel", this.handleMouseWheel, this);

		this.monthPicker = this.el.down('div.x-date-mp');
		this.monthPicker.enableDisplayMode('block');

		var kn = new Ext.KeyNav(this.eventEl, {
			"left" : function(e) {
				e.ctrlKey ? this.showPrevMonth() : this.update(this.activeDate.add("d", -1));
			},

			"right" : function(e) {
				e.ctrlKey ? this.showNextMonth() : this.update(this.activeDate.add("d", 1));
			},

			"up" : function(e) {
				e.ctrlKey ? this.showNextYear() : this.update(this.activeDate.add("d", -7));
			},

			"down" : function(e) {
				e.ctrlKey ? this.showPrevYear() : this.update(this.activeDate.add("d", 7));
			},

			"pageUp" : function(e) {
				this.showNextMonth();
			},

			"pageDown" : function(e) {
				this.showPrevMonth();
			},

			"enter" : function(e) {
				e.stopPropagation();
				return true;
			},

			scope : this
		});

		this.eventEl.on("click", this.handleDateClick, this, {
			delegate : "a.x-date-date"
		});

		this.eventEl.addKeyListener(Ext.EventObject.SPACE, this.selectToday, this);

		this.el.unselectable();

		this.cells = this.el.select("table.x-date-inner tbody td");
		this.textNodes = this.el.query("table.x-date-inner tbody span");

		this.mbtn = new Ext.Button({
			text : " ",
			tooltip : this.monthYearText,
			renderTo : this.el.child("td.x-date-middle", true)
		});

		this.mbtn.on('click', this.showMonthPicker, this);
		this.mbtn.el.child(this.mbtn.menuClassTarget).addClass("x-btn-with-menu");

		var dt1 = new Date();
		var txt = '';
		this.theHours = dt1.getHours();
		if (this.theHours < 10) {
			txt = '0' + this.theHours;
		} else {
			txt = this.theHours;
		}
		this.hoursSpinner.setValue(txt);

		this.theMinutes = dt1.getMinutes();
		if (this.theMinutes < 10) {
			txt = '0' + this.theMinutes;
		} else {
			txt = this.theMinutes;
		}
		this.minutesSpinner.setValue(txt);

		var today = (new Date()).dateFormat(this.format);
		var todayBtn = new Ext.Button({
			renderTo : this.el.child("td.x-date-bottom", true),
			text : String.format(this.todayText, today),
			tooltip : String.format(this.todayTip, today),
			handler : this.selectToday,
			scope : this
		});

		if (Ext.isIE) {
			this.el.repaint();
		}
		this.update(this.value);
	},

	onSpinnerChange : function() {
		if (!this.rendered) {
			return;
		}
		this.fireEvent('change', this, this.getHourAndMinuteValue());
	},
	getHourAndMinuteValue : function() {
		this.theHours = this.hoursSpinner.getValue();
		this.theMinutes = this.minutesSpinner.getValue();
	},
    setValue : function(value){
        var old = this.value;
        this.value = value;
        if(this.el){
            this.update(this.value);
        }
    },
	update : function(date) {
		var vd = this.activeDate;
		if(vd == this.value){
			return;
		}
		this.activeDate = date;
		if (vd && this.el) {
			var t = date.getTime();
			if (vd.getMonth() == date.getMonth() && vd.getFullYear() == date.getFullYear()) {
				this.cells.removeClass("x-date-selected");
				this.cells.each(function(c) {
					if (c.dom.firstChild.dateValue == t) {
						c.addClass("x-date-selected");
						setTimeout(function() {
							try {
								c.dom.firstChild.focus();
							} catch (e) {
							}
						}, 50);
						return false;
					}
				});
				if(vd.getHours() == date.getHours() && vd.getMinutes() == date.getMinutes()){
					return;
				}else{
					var txt = date?date.getHours():0;
					if (txt < 10) {
						txt = '0' + txt;
					}
					this.hoursSpinner.setValue(txt);
					txt = date?date.getMinutes():0;

					if (txt < 10) {
						txt = '0' + txt;
					} else {
						txt = txt;
					}
					this.minutesSpinner.setValue(txt);
					return;
				}
			}
		}
		var days = date.getDaysInMonth();
		var firstOfMonth = date.getFirstDateOfMonth();
		var startingPos = firstOfMonth.getDay() - this.startDay;

		if (startingPos <= this.startDay) {
			startingPos += 7;
		}

		var pm = date.add("mo", -1);
		var prevStart = pm.getDaysInMonth() - startingPos;

		var cells = this.cells.elements;
		var textEls = this.textNodes;
		days += startingPos;

		var day = 86400000;
		var d = new Date(pm.getFullYear(), pm.getMonth(), prevStart);
		var today = new Date().clearTime().getTime();
		var sel = date.clearTime().getTime();
		var min = this.minDate ? this.minDate.clearTime() : Number.NEGATIVE_INFINITY;
		var max = this.maxDate ? this.maxDate.clearTime() : Number.POSITIVE_INFINITY;
		var ddMatch = this.disabledDatesRE;
		var ddText = this.disabledDatesText;
		var ddays = this.disabledDays ? this.disabledDays.join("") : false;
		var ddaysText = this.disabledDaysText;
		var format = this.format;

		var setCellClass = function(cal, cell) {
			cell.title = "";
			d = d.clearTime();
			var t = d.getTime();
			cell.firstChild.dateValue = t;
			if (t == today) {
				cell.className += " x-date-today";
				cell.title = cal.todayText;
			}
			if (t == sel) {
				cell.className += " x-date-selected";
				setTimeout(function() {
					try {
						cell.firstChild.focus();
					} catch (e) {
					}
				}, 50);
			}
			// disabling
			if (t < min) {
				cell.className = " x-date-disabled";
				cell.title = cal.minText;
				return;
			}
			if (t > max) {
				cell.className = " x-date-disabled";
				cell.title = cal.maxText;
				return;
			}
			if (ddays) {
				if (ddays.indexOf(d.getDay()) != -1) {
					cell.title = ddaysText;
					cell.className = " x-date-disabled";
				}
			}
			if (ddMatch && format) {
				var fvalue = d.dateFormat(format);
				if (ddMatch.test(fvalue)) {
					cell.title = ddText.replace("%0", fvalue);
					cell.className = " x-date-disabled";
				}
			}
		};

		var i = 0;
		for (; i < startingPos; i++) {
			textEls[i].innerHTML = (++prevStart);
			d.setDate(d.getDate() + 1);
			cells[i].className = "x-date-prevday";
			setCellClass(this, cells[i]);
		}
		for (; i < days; i++) {
			var intDay = i - startingPos + 1;
			textEls[i].innerHTML = (intDay);
			d.setDate(d.getDate() + 1);
			cells[i].className = "x-date-active";
			setCellClass(this, cells[i]);
		}
		var extraDays = 0;
		for (; i < 42; i++) {
			textEls[i].innerHTML = (++extraDays);
			d.setDate(d.getDate() + 1);
			cells[i].className = "x-date-nextday";
			setCellClass(this, cells[i]);
		}

		this.mbtn.setText(this.monthNames[date.getMonth()] + " " + date.getFullYear());
		this.theHours = date?date.getHours():0;
		var txt = this.theHours;
		if (this.theHours < 10) {
			txt = '0' + this.theHours;
		}
		this.hoursSpinner.setValue(txt);
		this.theMinutes = date?date.getMinutes():0;
		if (this.theMinutes < 10) {
			txt = '0' + this.theMinutes;
		} else {
			txt = this.theMinutes;
		}
		this.minutesSpinner.setValue(txt);

		if (!this.internalRender) {
			var main = this.el.dom.firstChild;
			var w = main.offsetWidth;
			this.el.setWidth(w + this.el.getBorderWidth("lr"));
			Ext.fly(main).setWidth(w);
			this.internalRender = true;
			if (Ext.isOpera && !this.secondPass) {
				main.rows[0].cells[1].style.width = (w - (main.rows[0].cells[0].offsetWidth + main.rows[0].cells[2].offsetWidth)) + "px";
				this.secondPass = true;
				this.update.defer(10, this, [date]);
			}
		}
	}
});

Ext.ux.form.DateTimeItem = function(config) {

	Ext.ux.form.DateTimeItem.superclass.constructor.call(this, new Ext.ux.form.DateTimePicker(config), config);
	this.picker = this.component;
	this.addEvents({
		select : true
	});

	this.picker.on("render", function(picker) {
		picker.getEl().swallowEvent("click");
		picker.container.addClass("x-menu-date-item");
	});

	this.picker.on("select", this.onSelect, this);
};

Ext.extend(Ext.ux.form.DateTimeItem, Ext.menu.Adapter, {
	onSelect : function(picker, date) {
		this.fireEvent("select", this, date, picker);
		Ext.ux.form.DateTimeItem.superclass.handleClick.call(this);
	}
});

Ext.ux.form.DateTimeMenu = function(config) {
	Ext.ux.form.DateTimeMenu.superclass.constructor.call(this, config);
	this.plain = true;
	var di = new Ext.ux.form.DateTimeItem(config);
	this.add(di);
	this.picker = di.picker;
	this.relayEvents(di, ["select"]);
};
Ext.extend(Ext.ux.form.DateTimeMenu, Ext.menu.Menu);

Ext.reg('datetimepicker', Ext.ux.form.DateTimePicker);

spinner.js:

Ext.namespace("Ext.ux.form");

/**
 * Ext.ux.form.Spinner Class
 * 
 * @author Steven Chim
 * @version Spinner.js 2008-01-10 v0.21
 * 
 * @class Ext.ux.form.Spinner
 * @extends Ext.form.TriggerField 2008.06.25 wlh 增加对齐显示参数： align
 */

Ext.ux.form.Spinner = function(config) {
	Ext.ux.form.Spinner.superclass.constructor.call(this, config);
	this.addEvents({
		'spinup' : true,
		'spindown' : true
	});
}

Ext.extend(Ext.ux.form.Spinner, Ext.form.TriggerField, {
	triggerClass : 'x-form-spinner-trigger',
	splitterClass : 'x-form-spinner-splitter',

	alternateKey : Ext.EventObject.shiftKey,
	strategy : undefined,
	align : 'left',
	// private
	onRender : function(ct, position) {
		if (this.align == 'right') {
			this.fieldClass = 'x-form-num-field';
		}
		Ext.ux.form.Spinner.superclass.onRender.call(this, ct, position);

		this.splitter = this.wrap.createChild({
			tag : 'div',
			cls : this.splitterClass,
			style : 'width:13px; height:2px;'
		});
		this.splitter.show().setRight((Ext.isIE) ? 1 : 2);
		this.splitter.show().setTop((Ext.isIE) ? 10 : 10);

		this.proxy = this.trigger.createProxy('', this.splitter, true);
		this.proxy.addClass("x-form-spinner-proxy");
		this.proxy.setStyle('left', '0px');
		this.proxy.setSize(14, 1);
		this.proxy.hide();
		this.dd = new Ext.dd.DDProxy(this.splitter.dom.id, "SpinnerDrag", {
			dragElId : this.proxy.id
		});

		this.initSpinner();
	},

	// private
	initSpinner : function() {
		this.keyNav = new Ext.KeyNav(this.el, {
			"up" : function(e) {
				this.onSpinUp();
			},

			"down" : function(e) {
				this.onSpinDown();
			},

			"pageUp" : function(e) {
				this.onSpinUpAlternate();
			},

			"pageDown" : function(e) {
				this.onSpinDownAlternate();
			},

			scope : this
		});

		this.trigger.un("click", this.onTriggerClick);
		this.repeater = new Ext.util.ClickRepeater(this.trigger);
		// xyr 会出现两次click时间，去掉该行
		// this.repeater.on("click", this.onTriggerClick, this,
		// {preventDefault:true});
		this.trigger.on("mouseover", this.onMouseOver, this, {
			preventDefault : true
		});
		this.trigger.on("mouseout", this.onMouseOut, this, {
			preventDefault : true
		});
		this.trigger.on("mousemove", this.onMouseMove, this, {
			preventDefault : true
		});
		this.trigger.on("mousedown", this.onMouseDown, this, {
			preventDefault : true
		});
		this.trigger.on("mouseup", this.onMouseUp, this, {
			preventDefault : true
		});
		this.wrap.on("mousewheel", this.handleMouseWheel, this);
		this.wrap.on("blur", this.onBlur, this);

		this.dd.setXConstraint(0, 0, 10)
		this.dd.setYConstraint(1500, 1500, 10);
		this.dd.endDrag = this.endDrag.createDelegate(this);
		this.dd.startDrag = this.startDrag.createDelegate(this);
		this.dd.onDrag = this.onDrag.createDelegate(this);

		if (this.strategy == undefined) {
			this.strategy = new Ext.ux.form.Spinner.NumberStrategy();
		}
	},

	// private
	onMouseOver : function() {
		if (this.disabled) {
			return;
		}
		var middle = this.getMiddle();
		this.__tmphcls = (Ext.EventObject.getPageY() < middle) ? 'x-form-spinner-overup' : 'x-form-spinner-overdown';
		this.trigger.addClass(this.__tmphcls);
	},

	// private
	onMouseOut : function() {
		this.trigger.removeClass(this.__tmphcls);
	},

	// private
	onMouseMove : function() {
		if (this.disabled) {
			return;
		}
		var middle = this.getMiddle();
		if (((Ext.EventObject.getPageY() > middle) && this.__tmphcls == "x-form-spinner-overup")
				|| ((Ext.EventObject.getPageY() < middle) && this.__tmphcls == "x-form-spinner-overdown")) {
		}
	},

	// private
	onMouseDown : function() {
		if (this.disabled) {
			return;
		}
		var middle = this.getMiddle();
		this.__tmpccls = (Ext.EventObject.getPageY() < middle) ? 'x-form-spinner-clickup' : 'x-form-spinner-clickdown';
		this.trigger.addClass(this.__tmpccls);
	},

	// private
	onMouseUp : function() {
		this.trigger.removeClass(this.__tmpccls);
	},

	// private
	onTriggerClick : function() {
		if (this.disabled) {
			return;
		}
		var middle = this.getMiddle();
		var ud = (Ext.EventObject.getPageY() < middle) ? 'Up' : 'Down';
		this['onSpin' + ud]();
	},

	// private
	getMiddle : function() {
		var t = this.trigger.getTop();
		var h = this.trigger.getHeight();
		var middle = t + (h / 2);
		return middle;
	},

	handleMouseWheel : function(e) {
		var delta = e.getWheelDelta();
		if (delta > 0) {
			this.onSpinUp();
			e.stopEvent();
		} else if (delta < 0) {
			this.onSpinDown();
			e.stopEvent();
		}
	},

	onBlur : function(e) {
		this.strategy.onBlur(this);
		this.fireEvent("spinup", this);
	},

	// private
	startDrag : function() {
		this.proxy.show();
		this._previousY = Ext.fly(this.dd.getDragEl()).getTop();
	},

	// private
	endDrag : function() {
		this.proxy.hide();
	},

	// private
	onDrag : function() {
		if (this.disabled) {
			return;
		}
		var y = Ext.fly(this.dd.getDragEl()).getTop();
		var ud = '';

		if (this._previousY > y) {
			ud = 'Up';
		} // up
		if (this._previousY < y) {
			ud = 'Down';
		} // down

		if (ud != '') {
			this['onSpin' + ud]();
		}

		this._previousY = y;
	},

	// private
	onSpinUp : function() {
		// debugger;
		if (Ext.EventObject.shiftKey == true) {
			this.onSpinUpAlternate();
			return;
		} else {
			this.strategy.onSpinUp(this);
		}
		this.fireEvent("spinup", this);
	},

	// private
	onSpinDown : function() {
		if (Ext.EventObject.shiftKey == true) {
			this.onSpinDownAlternate();
			return;
		} else {
			this.strategy.onSpinDown(this);
		}
		this.fireEvent("spindown", this);
	},

	// private
	onSpinUpAlternate : function() {
		this.strategy.onSpinUpAlternate(this);
		this.fireEvent("spinup", this);
	},

	// private
	onSpinDownAlternate : function() {
		this.strategy.onSpinDownAlternate(this);
		this.fireEvent("spindown", this);
	}

});

Ext.reg('uxspinner', Ext.ux.form.Spinner);

/*******************************************************************************
 * Abstract Strategy
 */
Ext.ux.form.Spinner.Strategy = function(config) {
	Ext.apply(this, config);
};

Ext.extend(Ext.ux.form.Spinner.Strategy, Ext.util.Observable, {
	defaultValue : 0,
	minValue : undefined,
	maxValue : undefined,
	incrementValue : 1,
	alternateIncrementValue : 5,

	onSpinUp : function(field) {
		this.spin(field, false, false);
	},

	onSpinDown : function(field) {
		this.spin(field, true, false);
	},

	onSpinUpAlternate : function(field) {
		this.spin(field, false, true);
	},

	onSpinDownAlternate : function(field) {
		this.spin(field, true, true);
	},

	onBlur : function(field){
		// extend
	},

	spin : function(field, down, alternate) {
		// extend
	},

	fixBoundries : function(value) {
		return value;
		// overwrite
	}

});

/*******************************************************************************
 * Concrete Strategy: Numbers
 */
Ext.ux.form.Spinner.NumberStrategy = function(config) {
	Ext.ux.form.Spinner.NumberStrategy.superclass.constructor.call(this, config);
};

Ext.extend(Ext.ux.form.Spinner.NumberStrategy, Ext.ux.form.Spinner.Strategy, {

	allowDecimals : true,
	decimalPrecision : 2,

	onBlur : function(field){
		var v = parseFloat(field.getValue());
		v = (isNaN(v)) ? this.defaultValue : v;
		v = this.fixBoundries(v);
		field.setRawValue(v);
	},

	spin : function(field, down, alternate) {
		// debugger;
		Ext.ux.form.Spinner.NumberStrategy.superclass.spin.call(this, field, down, alternate);

		var v = parseFloat(field.getValue());
		var incr = (alternate == true) ? this.alternateIncrementValue : this.incrementValue;

		(down == true) ? v -= incr : v += incr;
		v = (isNaN(v)) ? this.defaultValue : v;
		v = this.fixBoundries(v);
		field.setRawValue(v);
	},

	fixBoundries : function(value) {
		var v = value;

		if (this.minValue != undefined && v < this.minValue) {
			v = this.minValue;
		}
		if (this.maxValue != undefined && v > this.maxValue) {
			v = this.maxValue;
		}

		return this.fixPrecision(v);
	},

	// private
	fixPrecision : function(value) {
		var nan = isNaN(value);
		if (!this.allowDecimals || this.decimalPrecision == -1 || nan || !value) {
			return nan ? '' : value;
		}
		return parseFloat(parseFloat(value).toFixed(this.decimalPrecision));
	}
});

/*******************************************************************************
 * Concrete Strategy: Date
 */
Ext.ux.form.Spinner.DateStrategy = function(config) {
	Ext.ux.form.Spinner.DateStrategy.superclass.constructor.call(this, config);
};

Ext.extend(Ext.ux.form.Spinner.DateStrategy, Ext.ux.form.Spinner.Strategy, {
	defaultValue : new Date(),
	format : "Y-m-d",
	incrementValue : 1,
	incrementConstant : Date.DAY,
	alternateIncrementValue : 1,
	alternateIncrementConstant : Date.MONTH,

	spin : function(field, down, alternate) {
		Ext.ux.form.Spinner.DateStrategy.superclass.spin.call(this);

		var v = field.getRawValue();

		v = Date.parseDate(v, this.format);
		var dir = (down == true) ? -1 : 1;
		var incr = (alternate == true) ? this.alternateIncrementValue : this.incrementValue;
		var dtconst = (alternate == true) ? this.alternateIncrementConstant : this.incrementConstant;

		if (typeof this.defaultValue == 'string') {
			this.defaultValue = Date.parseDate(this.defaultValue, this.format);
		}

		v = (v) ? v.add(dtconst, dir * incr) : this.defaultValue;

		v = this.fixBoundries(v);
		field.setRawValue(v.format(this.format));
	},

	// private
	fixBoundries : function(date) {
		var dt = date;
		var min = (typeof this.minValue == 'string') ? Date.parseDate(this.minValue, this.format) : this.minValue;
		var max = (typeof this.maxValue == 'string') ? Date.parseDate(this.maxValue, this.format) : this.maxValue;

		if (this.minValue != undefined && dt < min) {
			dt = min;
		}
		if (this.maxValue != undefined && dt > max) {
			dt = max;
		}

		return dt;
	}

});

/*******************************************************************************
 * Concrete Strategy: Time
 */
Ext.ux.form.Spinner.TimeStrategy = function(config) {
	Ext.ux.form.Spinner.TimeStrategy.superclass.constructor.call(this, config);
};

Ext.extend(Ext.ux.form.Spinner.TimeStrategy, Ext.ux.form.Spinner.DateStrategy, {
	format : "H:i",
	incrementValue : 1,
	incrementConstant : Date.MINUTE,
	alternateIncrementValue : 1,
	alternateIncrementConstant : Date.HOUR
});

Spinner.css

.x-form-spinner-proxy { /*background-color:#ff00cc;*/

}
.x-form-field-wrap .x-form-spinner-trigger {
	background: transparent url(../images/spinner.gif) no-repeat 0 0;
}
.x-form-field-wrap .x-form-spinner-overup {
	background-position: -17px 0;
}
.x-form-field-wrap .x-form-spinner-clickup {
	background-position: -34px 0;
}
.x-form-field-wrap .x-form-spinner-overdown {
	background-position: -51px 0;
}
.x-form-field-wrap .x-form-spinner-clickdown {
	background-position: -68px 0;
}
.x-trigger-wrap-focus .x-form-spinner-trigger {
	background-position: -85px 0;
}
.x-trigger-wrap-focus .x-form-spinner-overup {
	background-position: -102px 0;
}
.x-trigger-wrap-focus .x-form-spinner-clickup {
	background-position: -119px 0;
}
.x-trigger-wrap-focus .x-form-spinner-overdown {
	background-position: -136px 0;
}
.x-trigger-wrap-focus .x-form-spinner-clickdown {
	background-position: -153px 0;
}

使用方式：
[code="java"]
		this.birthday = new Ext.form.DateField({
			renderTo : 'birthday',
			width : 120,
			format : 'Y-m-d H:i',
			menu : new Ext.ux.form.DateTimeMenu(),
			selectOnFocus : true,
			allowBlank : true,
			msgTargethelp:'title'
		});