动态更改数据源jQuery ui自动完成焦点输入字符

Question

我试图尝试使用jQuery自动完成功能为输入框使用不同的数据源选项.

我有id #polysearch的输入框.我想自动完成焦点上的输入框(只是放光标)和源选项'data1',我想在键入2个字符时自动填充带有源选项'data2'的输入框.请帮忙!

谢谢!

Answer 1

通过使用source自动完成选项,您可以根据request.term(用户在框中键入的内容)的长度自定义要使用的数组.

您还需要search在输入聚焦时手动调用自动完成的方法,以使其在焦点上打开.

这是我必须完成这项工作的代码.看到它在行动.

$(function() {
    var data1 = 'abcdefghijklmnopqrstuvwxyz'.split('');
    var data2 = 'cat dog fish shark unicorn sasquatch flamingo dingo snake mouse rat'.split(/\s+/g);

    $('#in').autocomplete({
        minLength: 0, // so it shows straight away without typing anything
        source: function (request, response) {
            if ((request.term || '').length <= 1)
               response(filter(data1, request.term));
            else
               response(filter(data2, request.term));
        }
    }).on('focus', function () {
        $(this).autocomplete('search', '');
    });

    function filter(array, searchTerm) {
        var matchingItems = [];
        for (var i = 0; i < array.length; i++) {
            if (array[i].indexOf(searchTerm.toLocaleLowerCase()) >= 0)
                matchingItems.push(array[i]);
        }
        if (matchingItems.length === 0)
            return ['No Matches'];
        return matchingItems;
    }
});