ajax - 等待 ajax 请求直到用户停止输入

Question

我有一个实时搜索字段，可以在键入时进行 ajax 调用。我的问题是它会调用每一个输入的字母。这是我的代码

在 .js 文件中

  $(document).ready(function(){
   $("#employees_search input").keyup(function() {
    $.get($("#employees_search").attr("action"), $("#employees_search").serialize(), null , "script");
    return false;
   });
  });

在 html 文件中

<div align="center" id="empName">
  <%= form_tag employees_path, :method => 'get', :id => "employees_search" do %>
  <p>
    <%= text_field :search, params[:search], placeholder: 'Search Employees Here', id: 'search_field' %>
  </p>
  <% end %>
</div>

在控制器中

   @employees = Employee.where("department='Delivery'").paginate(:per_page => 6, :page => params[:page]).searchByEmp(params[:search][0]).order('name ASC')

在模型中

  def self.searchByEmp(search)
      if search
        where('name LIKE ?', "#{search}%")
      else
         scoped
      end
  end

实际上，我只需要在用户停止输入单词后才需要发送 ajax 请求，而不是每个输入的字母。我怎样才能做到这一点？提前致谢。

Answer 1

var liveSearchTimer;
$liveSearchInput.keyup(function() {
  clearTimeout(liveSearchTimer);
  liveSearchTimer = setTimeout(liveSearchDoAjax, 500);
});

只有在半秒内没有按键被按下时，才会发送请求。