javascript - onkeyup 激活很多ajax请求

Question

在一个条目中，我使用 onkeyup 函数，以便每次键入它时，我都会激活一个 javascript 函数，该函数使用 ajax 向服务器发出请求，当用户快速键入时就会出现问题，因此他/她触摸并激活了一个ajax请求，这给我带来了很多请求，也给我带来了不好的结果。不知道这样理解是否正确，希望有人能给我一个如何改变的想法。谢谢

Answer 1

这种 ajax 调用不是一个好主意。

无论如何，

• 当用户输入至少 3-4 个字母时，您应该执行 ajax 调用。
• 您还可以添加一些检查来查看用户是否输入了某些内容并停止写入，然后执行 ajax。
• 如果您仍然想对每个字符执行 ajax，那么尝试执行非常轻的 ajax 意味着从服务器获取非常小的数据。

检查输入长度是否> 3:

var userInput = $('#inputFiled').val();  // get user input  and save into js variable
if(userInput.length > 3){   //if user input is at least 3 characters
  //do ajax here
}

检查用户是否已停止写入

为此，您必须使用 underscore.js

$('#userInout').keyup(_.debounce(yourAjaxCallFunctionHere , 500)); 
underscorejs.org/#debounce

您还可以使用 jQuery 实现此目的

var delayInAjaxCall = (function(){
      var timer = 0;
      return function(callback, milliseconds){
      clearTimeout (timer);
      timer = setTimeout(callback, milliseconds);
   };
})();

上述函数的使用

$('input').keyup(function() {
   delayInAjaxCall(function(){
   alert('Hi, func called');
   }, 1000 );
});