同意@going的答案。下面是另一个类似的解决方案。唯一的区别是我使用的是.on("input"…)而不是keyup。这只捕获输入中的更改。其他按键如Ctrl, Shift等被忽略

var typingTimer;                //timer identifier
var doneTypingInterval = 5000;  //time in ms (5 seconds)

//on input change, start the countdown

$('#myInput').on("input", function() {    
    clearTimeout(typingTimer);
    typingTimer = setTimeout(function(){
        // doSomething...
    }, doneTypingInterval);
});

如果您正在寻找特定的长度(例如邮政编码字段):

$("input").live("keyup", function( event ){
if(this.value.length == this.getAttribute('maxlength')) {
        //make ajax request here after.
    }
  });

不确定我的需求是不是有点奇怪，但我需要类似于这个的东西，这就是我最终使用的:

$('input.update').bind('sync', function() {
    clearTimeout($(this).data('timer'));            
    $.post($(this).attr('data-url'), {value: $(this).val()}, function(x) {
        if(x.success != true) {
            triggerError(x.message);    
        }
    }, 'json');
}).keyup(function() {
    clearTimeout($(this).data('timer'));
    var val = $.trim($(this).val());
    if(val) {
        var $this = $(this);
        var timer = setTimeout(function() {
            $this.trigger('sync');
        }, 2000);
        $(this).data('timer', timer);
    }
}).blur(function() {
    clearTimeout($(this).data('timer'));     
    $(this).trigger('sync');
});

这允许我在我的应用程序中有这样的元素:

<input type="text" data-url="/controller/action/" class="update">

当用户“完成输入”(2秒内没有动作)或转到另一个字段(模糊出元素)时更新

我只是想出了一个简单的代码，等待用户完成输入:

步骤1。将超时设置为空，然后在用户输入时清除当前超时。

步骤2。触发keyup事件之前定义的变量的清除超时。

步骤3.为上面声明的变量定义timeout;

<input type="text" id="input" placeholder="please type" style="padding-left:20px;"/>
<div class="data"></div>

javascript代码

var textInput = document.getElementById('input');
var textdata = document.querySelector('.data');
// Init a timeout variable to be used below
var timefired = null;

// Listen for keystroke events
// Init a timeout variable to be used below
var timefired = null;// Listen for keystroke events
textInput.onkeyup = function (event) {
clearTimeout(timefired);
timefired = setTimeout(function () {
    textdata.innerHTML = 'Input Value:'+ textInput.value;
  }, 600);
};

对于alpine.js用户<input @input.debounce.500ms="fn()" >

如果你需要等待，直到用户完成输入使用简单的这个:

$(document).on('change','#PageSize', function () {
    //Do something after new value in #PageSize       
});

使用ajax调用的完整示例-这适用于我的寻呼机-每个列表的项目计数:

$(document).ready(function () {
    $(document).on('change','#PageSize', function (e) {
        e.preventDefault();
        var page = 1;
        var pagesize = $("#PageSize").val();
        var q = $("#q").val();
        $.ajax({
            url: '@Url.Action("IndexAjax", "Materials", new { Area = "TenantManage" })',
            data: { q: q, pagesize: pagesize, page: page },
            type: 'post',
            datatype: "json",
            success: function (data) {
                $('#tablecontainer').html(data);
               // toastr.success('Pager has been changed', "Success!");
            },
            error: function (jqXHR, exception) {
                ShowErrorMessage(jqXHR, exception);
            }
        });  
    });
});