Я пробовал читать об этом сегодня, и я не могу найти ответ здесь или через 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! Вот проблема". вроде проблемы, и мне просто нужен новый набор свежих глаз. :)
Уэлп, я дал ему около часа и получил только шесть просмотров. Мне удалось что-то сделать. Будет ли это работать во всех браузерах? Только время и, скорее всего, много часов разочарования расскажут.
$("#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? Он отлично работает!