Можно ли ограничить ввод недопустимых нажатий клавиш с jQuery поле комбинированного списка автоматического заполнения UI?
Когда использование UI jQuery автоматически заполняет поле комбинированного списка, я был бы думать, что будет опция вызвать только допустимую ключевую запись на основе списка. Там какой-либо путь не состоит в том, чтобы позволить недопустимые ключи, таким образом, можно только ввести допустимые объекты в список? Кроме того, есть ли способ установить значение по умолчанию поля комбинированного списка?
Если мой список имеет (C#, Java, Python)
Я могу начать вводить "abcds.". и это позволяет мне ввести его. Я хочу только, чтобы действительные доступы были позволены.
3 ответа
ОБНОВЛЕНО 2
Tested on
Internet Explorer 6 and later
Chrome
Firefox
Opera
Основной код JavaScript:
var Tags = ['csharp', 'java', 'python' ];
$("#autocomplete").keypress(function(event) {
//Firefox workaround..
if (!event.which &&
((event.charCode || event.charCode === 0) ? event.charCode: event.keyCode)) {
event.which = event.charCode || event.keyCode;
}
var charCode = String.fromCharCode(event.which).toLowerCase();
var search_val = this.value + charCode;
var x = search_val.length - 1;
var match;
for (var i = 0; i < Tags.length; i++) {
if (charCode == Tags[i][x] && Tags[i].indexOf(search_val) != -1) {
match = true;
}
}
//Backspace functionality added!
if (!match && event.which != 8 ) {
event.preventDefault();
}
});
ПРИМЕЧАНИЕ:
- принудительно вводит только допустимый ключ на основе списка;
- устанавливает значение по умолчанию;
- упрощенная реализация; -)
Позвольте мне знать!
Ваш вопрос также, кажется, является частым запросом на форуме плагинов jQuery и в Как реализовать «mustMatch» и «selectFirst» в автозаполнении jQuery UI люди обсуждали это проблема.
принятый ответ на этот вопрос работает. Итак, решение Док Хоффидей действительно заслуживает очков репутации.
В качестве альтернативы вы можете использовать автозаполнение Йорна Заефферера с опцией « mustMatch ».
<script type="text/javascript">
$(document).ready(function(){
var availableTags = ["csharp", "java", "python"];
$("#tags").autocomplete(availableTags, {
mustMatch: true
});
});
</script>
<input id="tags" />
ОБНОВЛЕНИЕ
Изначально я пропустил, что вам нужно решение для поля со списком. Спасибо, что разъяснили это.
Мне нужно было внести несколько изменений, чтобы он действительно работал в форме. Я ввел небольшую задержку, чтобы события происходили в правильном порядке. Помимо этого, я вставил решение Дока Хоффидая.
Я использовал событие «change», но вы также можете заставить что-то работать, используя событие «close». Ненавижу это говорить, но мой опыт работы с новым автозаполнением пользовательского интерфейса jQuery показывает, что это немного ненадежно. Кажется, что все идет не так, когда у вас настроено более одного типа обратного вызова событий.
ОБНОВЛЕНИЕ 2
Я добавил новый настраиваемый селектор на основе решения Дока Хоффидая, чтобы введенный текст не перезаписывался, когда он соответствует началу допустимой опции. Я также обновил его, чтобы источник ограничил предлагаемые варианты более точными совпадениями. Надеюсь, это ближе к вашим требованиям.
После настройки автозаполнения используйте этот код, чтобы предотвратить символ пробела и символ равенства (ASCII код 32 и 61). И установить значение по умолчанию;
$("#myautocompletectrl").keypress(function (e) {
if (e.which == 32 | e.which == 61) {
e.preventDefault();
}
}).val('mydefaultvalue');
Он действует так, как будто клавиша никогда не была нажата (как вы сказали, вы хотели).
Проверено на Firefox 3.63 и jQuery UI 1.8 Autocomplete.
Также, если вы обнаружите, что хотите дополнительно реализовать функциональность mustMatch в автозаполнении jQuery UI 1.8, то посмотрите здесь: Как реализовать "mustMatch" и "selectFirst" в jQuery UI Autocomplete?
EDIT: Я вижу, вы уже прочитали и прокомментировали мой пост.... :)