#jquery #ajax #timeout #keyup
#jquery #ajax #тайм-аут #ввод ключа
Вопрос:
<script type="text/javascript">
var delay = (function() {
var timer = 0;
return function(callback, ms) {
clearTimeout(timer);
timer = setTimeout(callback, ms);
};
})();
$(function() {
$('#activity').change(function() {
$(this).val() == "SID" ? $('.SIDContainer').show() : $('.SIDContainer').hide();
});
$('.SID').keyup(function() {
delay(function() {
$.ajax({
url: '../SentinelOperationsUI/GenericHandler.ashx',
data: { 'SID': $(this).val() },
dataType: 'json',
success: function(data) {
if (data.SID != null) {
$('.SIDResult').text('Match: ' ' SID: ' data.SID);
console.log(data);
}
}
});
}, 500);
});
});
Код работает без функции задержки. Но я хочу задержку здесь, потому что в противном случае для одного и того же значения может быть отправлено несколько ajax-запросов (если вы вводите достаточно быстро). Есть идеи, что может быть причиной этого? Возможно, какие-либо другие решения этой проблемы? Спасибо
Ответ №1:
Вместо того, чтобы использовать задержку, почему бы не назначить ваш вызов ajax переменной, а затем проверять ее на null при каждом новом событии ввода. Что-то вроде:
var ajaxcall;
$('.SID').keyup(function() {
if ( ajaxcall != null ){
ajaxcall.abort();
}
ajaxcall = $.ajax({
url: '../SentinelOperationsUI/GenericHandler.ashx',
data: { 'SID': $(this).val() },
dataType: 'json',
success: function(data) {
if (data.SID != null) {
$('.SIDResult').text('Match: ' ' SID: ' data.SID);
console.log(data);
}
}
});
});
Это гарантировало бы, что каждое действие keyup будет охватывать новое событие ajax и отменять любое предыдущее.