Andy07 Ответов: 1

Прокрутка выпадающего списка

Я сделал автозаполнение поиска с выпадающим списком, но прокрутка не сработала, и список разбился с клавиатуры на планшете

Что я уже пробовал:

Я использую этот код для поиска и отображения списка
function ListPlayer(ScnFK, list) {
    var selectName = null;
    tempName = [];
    $("#" + list + "").autocomplete({
        source: arr,
        minLength: 1,
        hint: true,
        highlight: true,
        scroll: true,
        autofocus: true,
        search: function (oEvent, oUi) {
            var sValue = $(oEvent.target).val();
            var aSearch = [];
            $(arr).each(function (index, element) {
                var str = $(element).attr("value");
                str = str.toUpperCase();
                if (str.substr(0, sValue.length) == sValue.toUpperCase()) {
                    for (var j = 0; j < lists.length; j++) {
                        selectName = $("#" + lists[j]).attr("value");
                        tempName.push(selectName.toUpperCase());
                    }
                    if (~tempName.indexOf(str.toUpperCase()) > -1) {
                        aSearch.push(element);
                    }
                }
            });
            $(this).autocomplete("option", "source", aSearch);
        },
        open: function (oEvent, oUi) {
            $('.ui-autocomplete').off('menufocus hover mouseover mouseenter');
        }
    });
    if (~lists.indexOf(list) > -1) {
        lists.push(list);
    }
}

1 Ответов

Рейтинг:
9

Super Superman

Есть пример этого по адресу jQuery UI Autocomplete - прокручиваемые результаты[^]. Похоже, ему просто нужно немного магии CSS:

<style>
.ui-autocomplete {
    max-height: 100px;
    overflow-y: auto;
    /* prevent horizontal scrollbar */
    overflow-x: hidden;
}
/* IE 6 doesn't support max-height
 * we use height instead, but this forces the menu to always be this tall
 */
* html .ui-autocomplete {
    height: 100px;
}
</style>