Question

我有2个输入框：＆＃39;标题＆＃39;和＆＃39;网址＆＃39;。

＆＃39;名称＆＃39;使用onblur事件来调用函数GetURL()和＆＃39; URL＆＃39;使用onkeyup事件来调用函数GetURL()。

GetURL()函数检查输入内容然后调用使用AJAX返回格式化字符串。

该功能如下所示，但如何添加延迟，以便在用户快速输入时，该功能不会被重复调用？

<input type="text" id="Title" name="Title" onblur="GetURL('Title');">
<input type="text" id="URL" name="URL" onkeyup="GetURL('URL');">

function GetURL(strFieldID) {
    if (strFieldID=="Title"&&$('#URL').val()!="") {
        //do nothing
    }
    else {
        $.ajax({
            url: "ajax_dataprovider_url.php",
            type: "POST",
            data: {URL: $('#'+strFieldID).val()},
            async: false,
            cache: false
        }).done(function(strResponse) {
            //output the formatted URL
            document.getElementById("PageURL").value = strResponse;
        });
    }
}

Answer 1

只需添加一个变量即可同时延迟停止发送。

var sending=false;
function GetURL(strFieldID) {
if (strFieldID=="Title"&&$('#URL').val()!="") {
    //do nothing
}
else if (!sending) {
    sending=true;
    $.ajax({
        url: "ajax_dataprovider_url.php",
        type: "POST",
        data: {URL: $('#'+strFieldID).val()},
        async: false,
        cache: false
    }).done(function(strResponse) {
        //output the formatted URL
        sending=false;
        document.getElementById("PageURL").value = strResponse;
    });
}
}

Answer 2

我要回答我自己的问题......

function GetURL(strFieldID) {
if (strFieldID=="Title"&&$('#URL').val()!="") {
    //do nothing
}
else {
    setTimeout(function(){
        $.ajax({
            url: "ajax_dataprovider_url.php",
            type: "POST",
            data: {URL: $('#'+strFieldID).val()},
            async: false,
            cache: false
        }).done(function(strResponse) {
            //output the formatted URL
            document.getElementById("PageURL").value = strResponse;
        });
    }, 1000);
}

我告诉过你这很简单！

为jQuery AJAX调用添加延迟

2 个答案: