HTML:
<input type="text" name="item" value="" id="item" class="input-xlarge" placeholder="Enter item name or scan barcode" accesskey="i" />
JavaScript:
$( "#item" ).autocomplete({
source: '<?php echo site_url("sales/item_search"); ?>',
delay: 10,
autoFocus: false,
minLength: 0,
select: function(event, ui)
{
event.preventDefault();
$( "#item" ).val(ui.item.value);
$('#add_item_form').ajaxSubmit({target: "#register_container", beforeSubmit: salesBeforeSubmit, success: itemScannedSuccess});
}
});
setTimeout(function(){$('#item').focus();}, 10);
Когда страница загружается в Internet Explorer, автозаполнение происходит с пустым значением термина, результатом которого является куча результатов. Если я удалю атрибут placeholder, он будет функционировать так, как ожидалось, и НЕ делает запрос до ввода текста.
Если я удалю событие фокуса, он также работает в Internet Explorer. Но мне нужно сосредоточиться на загрузке страницы, поэтому на самом деле это не варианты. Я также хотел бы сохранить текст заполнителя.
Элемент функционирует так, как ожидалось (без запроса до ввода) в сафари, firefox и chrome.
Это ошибка? Есть ли обходной путь, поэтому я могу использовать атрибут placeholder?
Я собрал 2 примера; сломанной и фиксированной. Единственная разница между ними - наличие атрибута placeholder (в сломанной версии).
Сломанный только ломается в IE и функционирует как ожидалось в других браузерах.
ПРИМЕЧАНИЕ: по сломанному я имею в виду, что при фокусировке на поле автозаполнение активируется, когда оно не должно быть.
http://blastohosting.com/jquery_ui_autocomplete_bug/broken.html
http://blastohosting.com/jquery_ui_autocomplete_bug/working.html
ПРИМЕЧАНИЕ. В обоих этих примерах ajax всегда будет одним и тем же результатом. Пожалуйста, проигнорируйте это.