Javascript 延迟将AJAX数据传递给PHP

我正在尝试创建一个ajax搜索。我尝试创建一个快速加载php和另一个包含搜索表单的php页面

搜索表格：

搜索PHP链接示例：

/searchform/？key=string

searchNotes（）

JS函数：

function debounce(func, wait, immediate) {
  var timeout;
  return function() {
    var context = this,
      args = arguments;
    var callNow = immediate && !timeout;
    clearTimeout(timeout);
    timeout = setTimeout(function() {
      timeout = null;
      if (!immediate) {
        func.apply(context, args);
      }
    }, wait);
    if (callNow) func.apply(context, args);
  }
}

function searchNotes() {

  var searcher = document.getElementById("searchtop").value;
if (searcher.length > 3) {
 currentRequest = jQuery.ajax({
     type: 'GET',
     url: '/searchform/?key='+searcher,
                   cache: false,

     success: function(data) {
             $("#datafetch").html(data);
     }
 })};

}

var debounced = debounce(searchNotes, 50);

window.addEventListener('keyup', debounced);

问题：当我尝试在输入上快速键入例如“smoot”时，它一开始工作正常，但随后在主“smoot”结果上加载所有“smoot”、“smoo”等，而“smoot”被

jQuery（'#datafetch'）.html（''）删除由其他不完整的字符串生成

我想找到一种方法来获取在没有问题的输入上键入的最后一个字符串。
好的，这是我解决此问题的方法：


var searchInput = $("#searchtop");
var searchQueryDisplay = $("#datafetch");

var showSearchQuery = function() {

      var searcher = document.getElementById("searchtop").value;
    if (searcher.length > 3) {

     currentRequest = jQuery.ajax({
         type: 'GET',
         url: '/searchform/?key='+searcher,
                       cache: false,

         success: function(data) {
                 $("#datafetch").html(data);
         }
     })};

    }


var debounceTimeout = null;
searchInput.on('change keyup', function(event){
  clearTimeout(debounceTimeout);
  debounceTimeout = setTimeout(showSearchQuery, 300);
});

查看debounce，您只需要
$（“#datafetch”）.html（数据）@lawrencerone我可以问一下黛博思的详细答案吗？当然可以，@lawrencerone所以我做了，而且几乎成功了，谢谢！但它会在1-2秒内再次显示不完整的字符串结果，然后自行修复。“你知道吗？”劳伦斯·切隆我刚找到答案。1号和2号字母搜索出现故障，它们替换了主字符串。我刚刚提出了一个条件，
searcher.length>3
非常感谢您的帮助；）