如何延迟发送ajax请求？

Question

这是我的代码：

$("input").on('keydown', function(){
    $.ajax({
        url :  '/files/tags_autocomplete.php',
        dataType : 'JSON',
        success : function (tags) {
            $("ul").html(tags.output);
        }
    });
});

我的代码在用户输入标签时向用户建议了一些标签（具有匹配的子字符串与用户目前已写入的标签）作为自动完成框。

我的问题是什么？ 我当前的代码每个keydown发送一个新的ajax请求。 例如，如果用户写了something ，我的脚本会发送9个ajax请求，这看起来像是一场噩梦。

无论如何，我该怎么处理？ 我的意思是我需要实现发送延迟吗？ 像“在插入最后一个字符后1秒才发送请求”之类的东西 ？ 或者有更好的主意吗？

Answer 1

您可以创建一个简单的节流机制

$("input").on('keydown', function(){

    clearTimeout( $(this).data('timer'); )

    var timer = setTimeout(function() {
      $.ajax({
          url :  '/files/tags_autocomplete.php',
          dataType : 'JSON',
          success : function (tags) {
              $("ul").html(tags.output);
          }
      });
    }, 500);

    $(this).data('timer', timer);
});