.keyup事件替代

Question

我有一个简单的自动完成测试，它使用硬编码的数据。

但是，当我添加自己的数据(包含1000多个数据)时，它不工作，只显示第一个字母，所以如果我的数据是"Apple“

当我键入B-它显示香蕉，但我不能键入"BA“，因为"A”消失。

我原以为我能写出整个单词，而不是第一封信。

这是工作代码：

 var validOptions = ["Bold", "Normal", "Default", "100", "200"]
previousValue = "";

$('#ac').autocomplete({
autoFocus: true,
source: validOptions
})
.keyup(function() {
var isValid = false;
for (i in validOptions) {
    if (validOptions[i].toLowerCase().match(this.value.toLowerCase())) {
        isValid = true;
    }
    }
    if (!isValid) {
     this.value = previousValue
} else {
    previousValue = this.value;
}
});

因此，这些字母:粗体“，”正常“，”默认“，"100"，"200”工作。

一旦我将更改为: validOptions：

var validOptions ='@Url.Action("SerialProdNumStockSiteAutoComplete", "Ajax")?stocksitenum=LW&model=' + $("#Form_Prod_Num").val();

不像它应该的那样工作。

还有别的办法吗，或者你知道我哪里出了问题。

这个问题是关于.keyup的一个替代方案

SerialProdNumStockSiteAutoComplete代码：

         public JsonResult SerialProdNumStockSiteAutoComplete(string term,string stocksitenum,string model)
    {
        return Json(AutoComplete.DeviceFromStockSite(term, stocksitenum, model), JsonRequestBehavior.AllowGet);
    }

库存设备：

 public static List<string> DeviceFromStockSite(string term, string stocksitenum, string model)
    {
        //devices will always come from serialised stock
        var qryStock =
            SC42Ctx.SPNlocs
                .Where(x => x.Nloc_Site_Num.StartsWith(stocksitenum)
                            && x.Nloc_Part_Num == model
                            && x.Nloc_Ord_Num == null)
                .Select(
                    s =>
                        new TicketSerialNumber
                        {
                            SerialNumber = s.Nloc_ID_Num,
                            Source = stocksitenum,
                            Call = s.Nloc_Ord_Num.ToString()
                        })
                .ToList();

当我复制URL时，如下所示：

http://localhost:58172/Ajax/SerialProdNumStockSiteAutoComplete?stocksitenum=LW&model=MP4000BADP&term=4&

这时我输入了4，不能再添加任何东西。

Answer 1

Try using the minLength option of autocomplete to specify the minimum number of characters: 

$('#ac').autocomplete({
autoFocus: true,
source: validOptions,
minLength: 3
})
.keyup(function() {
var isValid = false;
for (i in validOptions) {
    if (validOptions[i].toLowerCase().match(this.value.toLowerCase())) {
        isValid = true;
    }
    }
    if (!isValid) {
     this.value = previousValue
} else {
    previousValue = this.value;
}
});

Answer 2

这一守则是罪魁祸首：

 if (!isValid) {
     this.value = previousValue
} else {
    previousValue = this.value;
}

它说的是什么，就像值不匹配，那么它就不会让你输入那个值。

将代码更新为：

$(document).ready(function () {
    var validOptions = ["Bold", "Normal", "Default", "100", "200"]
    previousValue = "";

    $('#ac').autocomplete({
        autoFocus: true,
        source: validOptions
    })
        .keyup(function () {
        var isValid = false;
        for (i in validOptions) {
            if (validOptions[i].toLowerCase().match(this.value.toLowerCase())) {
                isValid = true;
            }
        }

    });
});

Answer 3

.keyup的替代方案 当用户输入来自自动完成的数据以外的其他内容时，显示错误

似乎要使用Response事件http://api.jqueryui.com/autocomplete/#event-response。

在搜索完成后，在显示菜单之前触发。对于建议数据的局部处理非常有用。搜索完成时总是会触发此事件，即使菜单不会显示，因为没有结果.

这将不适用于硬编码的数据，因为它只适用于使用URL进行搜索(您想要的)。

.keyup无法工作，因为它发生在搜索完成之前：

当您使用硬编码的数据(如小提琴)时，一切都很好，但是当您更改源为URL时，通过自动完成(可以通过在浏览器控制台中查看网络来确认)调用该URL (搜索)--这需要很短的时间异步地执行，而.keyup会立即发生(就像)。您可以通过在操作中添加一个Thread.Sleep()和在js中添加各种console.log来确认这一点。