Javascript 搜索栏-使用Ajax和JQuery动态添加内容

我正在尝试制作一个动态加载内容的搜索栏

然而，我希望在用户端键入之后开始真正的内容加载

我尝试了这个版本，但它不起作用，因为它不考虑每个事件“keyup”

---

有人知道解决方法吗？

你能做的是让你的函数重置一个触发器，该触发器将在x时间后触发。比如：

函数mycolfunction（myParameters）{
//每次发生这种情况时清除超时
clearTimeout（window.myTimeout）；
//创建一个新的超时
window.myTimeout=setTimeout（函数（）{
//1秒钟后做某事
}, 1000);
}
$（“.selector”）.on（'keyup-paste'，函数（）{
mycolfunction（myParameters）；
});如何指定搜索查询的结束？你是说1秒之后？你能解释一下你的代码发生了什么吗。。。我们看到，在“键控”之间，这里有可能出现延迟查询。因此，在回答问题之前，我们更好地理解预期结果。这里的load函数处理ajax调用。。如何发送？我希望搜索请求仅在用户在搜索输入中1秒钟内未键入任何内容后发送。为了更容易理解，我添加了load函数
let old_search = ""
let search = ""


$("#search_input").on('keyup paste',function(){

    $("#loader_active").show()
    $('#videos').empty()


    let old_search = $("#recherche").val()

    setTimeout(function (){
        search = $("#search_input").val()
        console.log(old_search + ">" + search)
        if (search == old_search){
            console.log("loading")
            start = 0;
            limit = 20;
            load(search, start, limit);
            start += limit;
        }
    }, 1000);

});

function load(search, start=0, limit=20) {

  $("#loader_active").show()

  let form_data = new FormData();
  form_data.append('search', search);
  form_data.append('start', start);
  form_data.append('limit', limit);


  $.ajax({

    url: "http://website.com/ajax/videos.php",
    contentType: false,
    dataType: "json",
    processData: false,
    cache: false,
    data: form_data,
    type: 'POST',

    success: function (data) {
      $(data).each(function(index, value) {
        showVideo(value) // show video creates divs with jquery     containing the data from the json received by the ajax call
      })
      $("#loader_active").hide()

    }
  })
}