mirror of
https://github.com/jquery/jquery-ui.git
synced 2025-01-07 20:34:24 +00:00
Spinner: Handle async focus events in IE. Fixes incorrect detection of changes.
This commit is contained in:
parent
ab4d8b748d
commit
d393c8b4cb
@ -121,7 +121,7 @@ test( "stop", function() {
|
||||
element.spinner( "value", 999 );
|
||||
});
|
||||
|
||||
test( "change", function() {
|
||||
asyncTest( "change", function() {
|
||||
expect( 14 );
|
||||
var element = $( "#spin" ).spinner();
|
||||
|
||||
@ -174,50 +174,56 @@ test( "change", function() {
|
||||
shouldChange( false, "button up, before blur" );
|
||||
element.spinner( "widget" ).find( ".ui-spinner-up" ).mousedown().mouseup();
|
||||
shouldChange( true, "blur after button up" );
|
||||
element.blur();
|
||||
setTimeout(function() {
|
||||
element.blur();
|
||||
|
||||
shouldChange( false, "button down, before blur" );
|
||||
element.spinner( "widget" ).find( ".ui-spinner-down" ).mousedown().mouseup();
|
||||
shouldChange( true, "blur after button down" );
|
||||
element.blur();
|
||||
shouldChange( false, "button down, before blur" );
|
||||
element.spinner( "widget" ).find( ".ui-spinner-down" ).mousedown().mouseup();
|
||||
shouldChange( true, "blur after button down" );
|
||||
setTimeout(function() {
|
||||
element.blur();
|
||||
|
||||
shouldChange( false, "many buttons, same final value, before blur" );
|
||||
element.spinner( "widget" ).find( ".ui-spinner-up" ).mousedown().mouseup();
|
||||
element.spinner( "widget" ).find( ".ui-spinner-up" ).mousedown().mouseup();
|
||||
element.spinner( "widget" ).find( ".ui-spinner-down" ).mousedown().mouseup();
|
||||
element.spinner( "widget" ).find( ".ui-spinner-down" ).mousedown().mouseup();
|
||||
shouldChange( false, "blur after many buttons, same final value" );
|
||||
element.blur();
|
||||
shouldChange( false, "many buttons, same final value, before blur" );
|
||||
element.spinner( "widget" ).find( ".ui-spinner-up" ).mousedown().mouseup();
|
||||
element.spinner( "widget" ).find( ".ui-spinner-up" ).mousedown().mouseup();
|
||||
element.spinner( "widget" ).find( ".ui-spinner-down" ).mousedown().mouseup();
|
||||
element.spinner( "widget" ).find( ".ui-spinner-down" ).mousedown().mouseup();
|
||||
shouldChange( false, "blur after many buttons, same final value" );
|
||||
element.blur();
|
||||
setTimeout(function() {
|
||||
shouldChange( true, "stepUp" );
|
||||
element.spinner( "stepUp" );
|
||||
|
||||
shouldChange( true, "stepUp" );
|
||||
element.spinner( "stepUp" );
|
||||
shouldChange( true, "stepDown" );
|
||||
element.spinner( "stepDown" );
|
||||
|
||||
shouldChange( true, "stepDown" );
|
||||
element.spinner( "stepDown" );
|
||||
shouldChange( true, "pageUp" );
|
||||
element.spinner( "pageUp" );
|
||||
|
||||
shouldChange( true, "pageUp" );
|
||||
element.spinner( "pageUp" );
|
||||
shouldChange( true, "pageDown" );
|
||||
element.spinner( "pageDown" );
|
||||
|
||||
shouldChange( true, "pageDown" );
|
||||
element.spinner( "pageDown" );
|
||||
shouldChange( true, "value" );
|
||||
element.spinner( "value", 999 );
|
||||
|
||||
shouldChange( true, "value" );
|
||||
element.spinner( "value", 999 );
|
||||
shouldChange( false, "value, same value" );
|
||||
element.spinner( "value", 999 );
|
||||
|
||||
shouldChange( false, "value, same value" );
|
||||
element.spinner( "value", 999 );
|
||||
shouldChange( true, "max, value changed" );
|
||||
element.spinner( "option", "max", 900 );
|
||||
|
||||
shouldChange( true, "max, value changed" );
|
||||
element.spinner( "option", "max", 900 );
|
||||
shouldChange( false, "max, value not changed" );
|
||||
element.spinner( "option", "max", 1000 );
|
||||
|
||||
shouldChange( false, "max, value not changed" );
|
||||
element.spinner( "option", "max", 1000 );
|
||||
shouldChange( true, "min, value changed" );
|
||||
element.spinner( "option", "min", 950 );
|
||||
|
||||
shouldChange( true, "min, value changed" );
|
||||
element.spinner( "option", "min", 950 );
|
||||
|
||||
shouldChange( false, "min, value not changed" );
|
||||
element.spinner( "option", "min", 200 );
|
||||
shouldChange( false, "min, value not changed" );
|
||||
element.spinner( "option", "min", 200 );
|
||||
start();
|
||||
});
|
||||
});
|
||||
});
|
||||
});
|
||||
|
||||
})( jQuery );
|
||||
|
42
ui/jquery.ui.spinner.js
vendored
42
ui/jquery.ui.spinner.js
vendored
@ -93,6 +93,11 @@ $.widget( "ui.spinner", {
|
||||
this.previous = this.element.val();
|
||||
},
|
||||
blur: function( event ) {
|
||||
if ( this.cancelBlur ) {
|
||||
delete this.cancelBlur;
|
||||
return;
|
||||
}
|
||||
|
||||
this._refresh();
|
||||
this.uiSpinner.removeClass( "ui-state-active" );
|
||||
if ( this.previous !== this.element.val() ) {
|
||||
@ -117,11 +122,42 @@ $.widget( "ui.spinner", {
|
||||
event.preventDefault();
|
||||
},
|
||||
"mousedown .ui-spinner-button": function( event ) {
|
||||
var previous;
|
||||
|
||||
// We never want the buttons to have focus; whenever the user is
|
||||
// interacting with the spinner, the focus should be on the input.
|
||||
// If the input is focused then this.previous is properly set from
|
||||
// when the input first received focus. If the input is not focused
|
||||
// then we need to set this.previous based on the value before spinning.
|
||||
previous = this.element[0] === this.document[0].activeElement ?
|
||||
this.previous : this.element.val();
|
||||
function checkFocus() {
|
||||
var isActive = this.element[0] === this.document[0].activeElement;
|
||||
if ( !isActive ) {
|
||||
this.element.focus();
|
||||
this.previous = previous;
|
||||
// support: IE
|
||||
// IE sets focus asynchronously, so we need to check if focus
|
||||
// moved off of the input because the user clicked on the button.
|
||||
this._delay(function() {
|
||||
this.previous = previous;
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
// ensure focus is on (or stays on) the text field
|
||||
event.preventDefault();
|
||||
if ( this.document[0].activeElement !== this.element[ 0 ] ) {
|
||||
this.element.focus();
|
||||
}
|
||||
checkFocus.call( this );
|
||||
|
||||
// support: IE
|
||||
// IE doesn't prevent moving focus even with event.preventDefault()
|
||||
// so we set a flag to know when we should ignore the blur event
|
||||
// and check (again) if focus moved off of the input.
|
||||
this.cancelBlur = true;
|
||||
this._delay(function() {
|
||||
delete this.cancelBlur;
|
||||
checkFocus.call( this );
|
||||
});
|
||||
|
||||
if ( this._start( event ) === false ) {
|
||||
return;
|
||||
|
Loading…
Reference in New Issue
Block a user