jQuery UI Автозаполнение автофокуса не связано с мышью

0

Я пробовал читать об этом сегодня, и я не могу найти ответ здесь или через Google. Я надеюсь, что кто-то может помочь сказать "ты идиот, это способ сделать это", и я могу продолжить свою жизнь. :)

У меня установлен jquery UI autocomplete плагин и работает нормально. Я добавил autoFocus: true и теперь я могу выполнить табуляцию, и он выберет первый доступный вариант. Однако, если я focusout на элементе ввода, автозаполнение не форсирует выбор, выбирая первый вариант. Я пробовал много разных, ужасных способов заставить это произойти, и я это сделал, но он отстает от моей системы и разбивает страницу.

У меня есть jQuery v1.10.2, jQuery UI Core 1.9.1 и jquery UI Autocomplete 1.10.4 работающий с моим приложением.

Текущее событие автозаполнения:

$("#element").autocomplete({
    source: "search.php",
    minLength: 2,
    select: function(event, ui) {
        $('#element').val(ui.item.value);
        getOptions();
    },
    autoFocus: true, 
    html: false, 
    open: function(event, ui) {
        $(".ui-autocomplete").css("z-index", 1000);
    }
});

Это работает правильно, но отстает от моей страницы и приведет к сбою браузера. Там какая-то форма бесконечного цикла здесь, которую я вижу, но не могу понять, чтобы исправить:

$("#element").click(function() {
    $("#element").blur(function() {
        $('.ui-autocomplete .ui-menu-item:first-child').click();
        $("#quantity").focus();
    });
});

Еще раз спасибо за любую помощь. Надеюсь, это "DOH! Вот проблема". вроде проблемы, и мне просто нужен новый набор свежих глаз. :)

Теги:
autocomplete

1 ответ

0

Уэлп, я дал ему около часа и получил только шесть просмотров. Мне удалось что-то сделать. Будет ли это работать во всех браузерах? Только время и, скорее всего, много часов разочарования расскажут.

$("#element").autocomplete({
    source: "search.php",
    minLength: 2,
    select: function(event, ui) {
        $('#element').val(ui.item.value);
        getOptions();
    },
    autoFocus: true,
    mustMatch: true,
    html: false,
    open: function(event, ui) {
        $(".ui-autocomplete").css("z-index", 1000);
    }
}).blur(function() {
    if($('#element').val() != $('#element').data('selected-item')) {
        if($('.ui-autocomplete').length) {
            $('.ui-autocomplete .ui-menu-item:first-child').click();
            $('#quantity').focus();
        }
    }
});

Я использовал blur чтобы получить возможность потерять фокус на поле ввода. Если значение поля ввода не совпадает с ранее выбранным значением, тогда я проверю, чтобы убедиться, что элемент ui-autocomplete существует. Если это так, то я принудительно нажимаю событие click на первом дочернем ui-menu-item элемента ui-menu-item, который является списком результатов. Моя озабоченность связана с селектором первого ребенка и некоторыми проблемами с перекрестным браузером, и я считаю, что мой первый тест в IE был не таким уж большим. Но для Chrome/FF/Safari? Он отлично работает!

Ещё вопросы

Сообщество Overcoder
Наверх
Меню