javascript - jquery autocomplete 如何设置标签以及如何获取值？

Question

我有一个使用类名作为子类别创建的动态输入字段。按键自动完成工作正常，我可以从中选择一个。

其工作代码如下

$("body").on('keypress', 'input.sub-category', function () {
        var availableTags = [
            {label:"ActionScript", value:"1"},
            {label:"ActionScript1", value:"11"},
            {label:"ActionScript2", value:"12"},
            {label:"ActionScript3", value:"13"},
            {label:"ActionScript4", value:"14"},
        ];
        $(this).autocomplete({
            source: availableTags,
        });
    });

当我选择自动建议的文本之一“ActionScript”时，它的值 (1) 应该在下面的代码中可用，我如何访问它？选择警报功能工作正常，因此只需要知道如何访问所选标签的值即可。

$("body").on('autocompleteselect', 'input.sub-category', function () {
        alert('here');
});

除此之外，我想知道如何设置输入框中选定的文本而不是它的值。

Answer 1

您需要包含 jquery-ui 文件文件中的“https://code.jquery.com/ui/1.12.0/jquery-ui.js”和只需更换

 $("body").on('autocompleteselect', 'input.sub-category', function () {
        alert('here');
});

包含以下几行。

$("body").on('autocompleteselect', 'input.sub-category', function (event,ui)     {
    alert(ui.item.label);
    alert(ui.item.value);

});

和

$(this).autocomplete({
        source: availableTags,
    });

与

$(this).autocomplete({
        source: availableTags,
        select:function(event,ui){
           $(".sub-category").val(ui.item.label);return false;
        }
    });

这可以很好地获取更多信息，请继续以下链接

http://api.jqueryui.com/autocomplete/