Javascript 根据键入的速度，onkeyup会触发多次

我在使用

onkeyup

函数时遇到了一个非常奇怪的问题。根据用户键入的速度，由键入触发的功能可能会运行多次

var inputFilter = document.getElementById('inputFilter');
inputFilter.onkeyup = function(e, value) {
e.preventDefault();
 value = e.target.value
   if (value.length >= 3) {
     console.log(value);
      getItems(value);
   }
};

如果我输入得慢，则

getItems（）

函数运行得很好，但如果我输入得真快，它的行为会很奇怪。

getItems（）

函数使用Ajax（

XMLHttpRequest（）

）从SharePoint列表中提取数据，并创建一个包含结果的表。如果我打字慢一点，表格就可以了，但是如果我打字快一点，表格的每一行都会重复。我在getItems（）函数中添加了一个

body.innerHTML='

，以确保每次运行函数时都清空表的主体：

 const table = document.getElementById('smeTable'),
 body = table.getElementsByTagName('tbody')[0];
 body.innerHTML = '';

---

我不是一个程序员，可能会因为这个可能很愚蠢的问题而获得很多反对票，但我对这个问题感到困惑。任何想法都将不胜感激。谢谢。

发生这种情况可能是因为您在短时间内生成了大量ajax请求，而且由于响应是异步的，所以对以前的keyUp事件的响应可能会在当前keyUp的响应之后加载，这可能会把事情搞得一团糟，特别是如果您正在提取一些自动完成的结果

我通常会在创建新请求时中止以前的ajax请求。您可以按照此处给出的关于如何中止上一个请求的答案进行操作：

---

你试过键盘吗？你需要一个更快的服务器和连接，或者你必须等到用户停止写，然后再去服务器。你在写代码，所以你是一个程序员。你得到了更多的选票。你看，生活可能会让人惊讶，

getItems

函数更有可能出现问题，而监听器的回调函数对于同一事件会被多次触发。如果每次都进行http调用，那么为keyup事件实现

debounce/throttle

方法总是一个好主意。谢谢，但是我们不允许使用jQuery。它要么是纯JavaScript，要么什么都不是（不客气。在这种情况下，您可以使用

XMLHttpRequest.abort（）

 var currentRequest = null;    

currentRequest = jQuery.ajax({
    type: 'POST',
    data: 'value=' + text,
    url: 'AJAX_URL',
    beforeSend : function()    {           
        if(currentRequest != null) {
            currentRequest.abort();
        }
    },
    success: function(data) {
        // Success
    },
    error:function(e){
      // Error
    }
});