在jQuery中自動完成搜索

Question

我在輸入類型中綁定了數據列表，以實現自動完成。 當數據量較小時，它的工作正常，但是網頁對大量數據不響應。 如果有其他綁定方法，請提出建議。

<input type="text" class="form-control" id="drp" list="datalst"/>
<datalist id="datalst"></datalist>

$.ajax({
    type: "POST",
    url: Urldata,
    contentType: "application/json; charset=utf-8",
    dataType: "json",
    data: JSON.stringify(obj),
    success: function (response) {
        $("#datalst").html('');
        if (response != null) {
            if (response.length > 0) {
                Resultdata = "";
                var lst= $.parseJSON(response);
                $.each(lst, function () {
                    Resultdata += "<option data-id='" + this.ID + "' value='" + this.value + "'>";
                });
                $("#datalst").append(Resultdata);  // **taking time to appned**
            }
        }
    }, error: function (jqXHR, textStatus, errorThrown) {
        if (jqXHR.status == 500) {
            console.log(jqXHR.responseText);
        } else {
            alert('Unexpected error.');
        }
    }
});

Answer 1

$.each(lst, function () {
     $("#datalst").append($('<option></option>').val(this.value).data('id',this.ID));
});