Can I have the previous ajax calling stopped when I raise a new one?
I'm using jQuery's autocomplete
, but have found a performance-related issue - if I input 'abc', it will be scanning by 'a', by 'ab', and by 'abc', at a once, how can I stop the previous 'a', 'ab' when ajax calling is doing searching by 'abc'?
The similar case is: I use jQuery DataTables, and want to do some searching like, I typed something to search (call search web method), and clicked button - 'Search' 3 times at a o开发者_Go百科nce, or changed search text just when I clicked 'Search', and raise a new search, how can I stop the previous useless ajax calling?
JQuery's $.ajax
returns a xmlHttpRequest object which can be canceled via its native method .abort()
$("#search").autocomplete({
minLength: 3,
delay: 300, // this is in milliseconds
json: true,
source: function(request, response){
// New request 300ms after key stroke
var $this = $(this);
var $element = $(this.element);
var previous_request = $element.data( "jqXHR" );
if( previous_request ) {
// a previous request has been made.
// though we don't know if it's concluded
// we can try and kill it in case it hasn't
previous_request.abort();
}
// Store new AJAX request
$element.data( "jqXHR", $.ajax( {
type: "POST",
url: "foo.php",
dataType: "json",
success: function( data ){
response( data );
}
}));
}
});
Assuming you are using jQuery UI Autocomplete:
- You can specify the minimum length of string before starts searching. (default is 3 I guess)
- You can also specify the delay between last keystroke and ajax call. Usually 2-300ms should do.
- AjaxQueue might help you to clean some stuff. Dunno how (I never need it), but worth a shot :)
精彩评论