当另一个密钥通信事件发射时,jQuery键取消



我试图在网站收件箱中键入文本时停止在表中显示一些数据。

我有事件键up在数据库中搜索一些数据,然后在网站上显示。但是,当某人键入更长的文本时,事件被解雇了很多次,其中很多字母正在键入。我想在键入另一个符号时取消最后一个事件,因此只有最后一个事件才能显示正确的数据。

现在,当我快速输入一些文本时,我会两次显示数据。

我使用的代码(简化版本(如下...

某个人可以建议我如何掌握它?

$( "#SAPdescription" ).keyup(function() {
    // Clear table
    $('#tblListSAP tbody').empty();
    if($('#SAPdescription').val().length >= 3)
    {
        $.ajax({
            type: "POST",
            url: "php/list_SAP.php",
            data: {
                SAPdescription: (!$('#SAPdescription').val()) ? "NULL" : $('#SAPdescription').val()
            },
            success: function(msg){
                if(msg.substr(0,5) == 'ERROR')
                {
                    error(msg);
                }
                else
                {
                    if(xmlRoot = getXML(msg))
                    {       
                        var rows = $(xmlRoot).find('row');
                        for(var i=0 ; i<rows.length ; i++)
                        {
                            var tr = $('<tr></tr>');
                            tr.append($('<td></td>').text(rows.eq(i).find('sapdescription').eq(0).text()));

                            $('#tblListSAP tbody').append(tr);
                        }
                    }
                    else
                    {
                        error('No data in received XML file!');
                    }
                }
            },
            error: AjaxErrorFunction
        });
    }
});

类似的东西。未经测试并用记事本编写,希望它能起作用...

将功能推迟以防止恒定呼叫并在中间通话中流产。

var xhr = null;
var timer = null;
$( "#SAPdescription" ).keyup(function() {
    // Clear table
    $('#tblListSAP tbody').empty();
    if($('#SAPdescription').val().length >= 3)
    {
        //if timer exists, reset it
        if (timer != null) {
            clearTimeout(timer);
            timer = null;
        }
        //abort the ajax call
        if (xhr != null) {
            xhr.abort();
            xhr = null;
        }
        //call function in 250ms to prevent it being repeatedly called every keyup
        timer = setTimeout(getList, 250);
    }
});
function getList() {
    xhr = $.ajax({
        type: "POST",
        url: "php/list_SAP.php",
        data: {
            SAPdescription: (!$('#SAPdescription').val()) ? "NULL" : $('#SAPdescription').val()
        },
        success: function(msg){
            if(msg.substr(0,5) == 'ERROR')
            {
                error(msg);
            }
            else
            {
                if(xmlRoot = getXML(msg))
                {       
                    var rows = $(xmlRoot).find('row');
                    for(var i=0 ; i<rows.length ; i++)
                    {
                        var tr = $('<tr></tr>');
                        tr.append($('<td></td>').text(rows.eq(i).find('sapdescription').eq(0).text()));

                        $('#tblListSAP tbody').append(tr);
                    }
                }
                else
                {
                    error('No data in received XML file!');
                }
            }
        },
        error: AjaxErrorFunction
    });
}

最新更新