防止在keyup上提交多个请求时自动完成。

Question

我有以下代码。

@using (Html.BeginForm("Search", "Home", FormMethod.Get,new { id="searchform",@onsubmit="seachformsubmit(event);" }))
        {
            <div class="searchTop">
                <div class="searchField posRelative">
                    <input type="text" name="search" data-resultslimit="12" data-url="@Url.Content("~/Home/_AutoSuggestSearchResult")" placeholder="Search products..." id="txtsearch" onkeyup="onsearchkeyup(this);" />
                    <span id="spsearcherror" class="errormsgsearch" style="display:none">At least 3 characters...</span>
                </div>
                <div class="searchAction blackBtn"><a href="javascript:;" onclick="searchsubmit(event);">View Results</a></div>
                <div class="clearBoth"></div>
            </div>
        }

Javascript

function onsearchkeyup(sender) {
$("#spsearcherror").hide();
var vle = $(sender).val();
if (vle != "") {
    if (vle.length < 3) {
        $("#spsearcherror").show();
    }
    else {
        InitSearch();
    }
  }
}
function InitSearch() {
var elem = $("#txtsearch");

$.ajax({
    type: "POST",
    url: elem.data("url"),      
    data: AddFormAntiForgeryToken({ 'keyword': elem.val(), 'recordsLimit': elem.data("resultslimit") }),
    dataType: 'json',   
    beforeSend: function () {
        $(".searchresult.ajaxloader").show();
    },
    success: function (data) {  
        $(".searchresult.ajaxloader").hide();
        $("#ulsearch").html(data.html);
        setTimeout(function () {
            pushBlockCarousel();
            matchHeightfnct();
        }, 300);
    }
  });       
}

我的问题是 _AutoSuggestSearchResult 被发射了这么多次，我需要找到一种方法来防止它在每次按键时发射那么多。

有什么建议和帮助，谢谢？

Answer 1

如果结果不一样，那么你可以在例程中做的是，在发送请求的时候，在某个地方捕捉最后发送的内容，比如数据属性。

elem.data("last-sent", value);

然后检查这个属性，以确定它们是不同的，然后再发送请求。

if (elem.data("last-sent") == value) {
   return; //exit due to the same value being the last value
}

有些自动完成控件实现了在开始之前输入一定数量的字符的延迟，这可能是你的另一个选择。