2017-05-30 74 views
1

我有一个输入字段。当这个字段有密码时,我发送一个请求。我的问题是当另一个键盘事件触发时,我需要取消所有未决的请求。我看到很多答案,但我还没有找到解决方案。如何取消待处理的ajax请求typeahead.js

var data = new Bloodhound({ 
    datumTokenizer: Bloodhound.tokenizers.whitespace, 
    queryTokenizer: Bloodhound.tokenizers.whitespace, 
    remote: { 
     wildcard: '%QUERY', 
     url: $('.typeahead').attr('data-autocomplete-url') + '?term=%QUERY', 
     rateLimitBy: 'throttle', 
     ajax: { 
      async: true, 
      dataType: 'json', 
      crossDomain: true, 
     } 
    } 

}); 

$('.typeahead').typeahead({ 
    hint: true, 
    highlight: true, 
    minLength: 1 
},{ 
    name: 'company', 
    displayKey: 'id', 
    limit: Infinity, 
    source: data, 
    templates: { 
     empty: [ 
      '<div style="margin: 4px 30px 4px 30px;" class="empty-message">', 
      ' Aucun résultat trouvé ', 
      '</div>' 
     ].join('\n'), 
     suggestion: function(data) { 
      if(data.id_db == 'more'){ 
       return '<p style="pointer-events:none">'+ data.text +'</p>'; 
      }else{ 
       return '<p>'+ data.text +'</p>'; 
      } 

     } 
    } 
}).on('typeahead:select', function(ev, data) { 
    $('#id_db').val(data.id_db); 
    changeCompany($(this)); 
}); 
+0

你可以改变你的远程设置的一点,acchieve你想使用中止()函数是什么。看到我的答案在这里:https://stackoverflow.com/a/46959188/3638529 – joalcego

回答

0

这是我使用的一个技巧。 clearTimeout取消上一个事件。所以只有当客户端停止输入400毫秒后,Ajax调用才会生效。

(我不知道预输入,所以使用任何事件处理,它需要...)

var timer; 
$('.typeahead').on('keyup', function(e) { 
    clearTimeout(timer); 
    timer = setTimeout(function() { 
     $.ajax({ 
     ... 
     }); 
    }, 
    400 // Guestimate the best value you want, usually I use 300 - 400 ms 
) 
});