Похоже, что это новая функция в JQuery UI 1.9.0, потому что я уже много раз использовал JQuery UI, и этот текст никогда не появлялся.
Не смог найти ничего связанного с этим в документации по API.
Итак, используя базовый пример автозаполнения с локальным источником
$( "#find-subj" ).autocomplete({
source: availableTags
});
Когда поиск совпадает, он показывает этот связанный вспомогательный текст:
'Доступен 1 результат, используйте клавиши со стрелками вверх и вниз для навигации.'
Как я могу отключить его красивым способом, не удаляя его с помощью селекторов JQuery.
Я знаю, что на этот вопрос уже отвечали, но просто хотел привести пример реализации:
var availableTags = [
"ActionScript",
"AppleScript",
"Asp",
"BASIC",
"C",
"C++"
];
$("#find-subj").autocomplete({
source: availableTags,
messages: {
noResults: 'no results',
results: function(amount) {
return amount + 'results.'
}
}
});
Это используется для доступности, простой способ скрыть его - с помощью CSS:
.ui-helper-hidden-accessible { display:none; }
Или (см. комментарий Daniel'a ниже)
.ui-helper-hidden-accessible { position: absolute; left:-999em; }
Верхний ответ здесь достигает желаемого визуального эффекта, но побеждает объект jQuery с поддержкой Ария, и немного глупыми, чтобы пользователи, которые полагаются на него! Те, кто'вэ отметил, что jQuery CSS и скрывает это для вас правильно, и это стиль, который делает это:
.ui-helper-hidden-accessible {
border: 0;
clip: rect(0 0 0 0);
height: 1px;
margin: -1px;
overflow: hidden;
padding: 0;
position: absolute;
width: 1px;
}
Скопируйте в вашу таблицу стилей вместо удаления сообщения, пожалуйста :).
Согласно этому блогу:
Теперь мы используем ARIA live regions для объявления о том, когда результаты станут доступны... и как перемещаться по списку предложений. Объявления могут быть настроены через опцию messages, которая имеет два свойства: noResults для случаев, когда не возвращается ни один элемент, и results для случаев, когда возвращается хотя бы >. один элемент возвращается. В общем, вам нужно будет изменить эти параметры только в том случае. опции, если вы хотите, чтобы строка была записана на другом языке. Опция messages может быть изменена в будущих версиях, пока мы >. работаем над полным решением для манипулирования строками и интернационализации во всех плагинах. Если вы заинтересованы в опция сообщений, мы рекомендуем вам просто прочитать исходный текст; > соответствующий код находится > на сайте. соответствующий код находится в самом низу плагина автозаполнения и составляет >. всего несколько строк.
...
Итак, как это относится к виджету автозаполнения? Ну, теперь, когда вы ищете элемент, если у вас установлен скринридер, он будет читать вам что-то вроде "Доступен 1 результат, используйте клавиши со стрелками вверх и вниз. для навигации". Довольно круто, да?
Если вы зайдете на github и посмотрите на исходный код autocomplete source code, в районе строки 571 вы увидите, где это действительно реализовано.
Добавляем jQuery CSS также работал, чтобы удалить текст инструкции.
<link
rel="stylesheet"
href="http://code.jquery.com/ui/1.9.0/themes/smoothness/jquery-ui.css" />
Так как это там по соображениям доступности, это's наверное лучше, чтобы скрыть его с помощью CSS.
Однако, я бы предложил:
.ui-helper-hidden-accessible { position: absolute; left: -9999px; }
А не:
.ui-helper-hidden-accessible { display:none; }
Как бывший скрыть элемент на экране, но все же позволяют экрану-читателей, чтобы прочитать его, в то время как дисплей:нет, совсем нет.
Ну, этот вопрос немного старше, но текст не появляется вообще, когда вы включите по CSS-файл:
<link
rel="stylesheet"
href="http://code.jquery.com/ui/1.9.0/themes/YOUR_THEME_HERE/jquery-ui.css" />
Конечно, вы должны вставить актуальная тема вместо YOUR_THEME_HERE, например, на "плавность"и
Стиль его, как сама тема jQuery стилей. Много других ответов предлагаю включая все таблицы стилей, но если вы просто хотите, чтобы соответствующее CSS, это как это's выполнено в http://code.jquery.com/ui/1.9.0/themes/smoothness/jquery-ui.css`:
.ui-helper-hidden-accessible {
position: absolute !important;
clip: rect(1px 1px 1px 1px);
clip: rect(1px,1px,1px,1px);
}
Добавив этот код сразу после автозаполнения в вашем скрипте будет толкать раздражает помощником на странице, но люди, использующие программы чтения с экрана будет по-прежнему выгодно:
$(document).ready(function() { //pushing the autocomplete helper out of the visible page
$(".ui-helper-hidden-accessible").css({"position": "absolute", "left":"-999em"}) //{"display","none"} will remove the element from the page
});
Я'м не фанат манипулируя CSS с JS, но в данном случае я думаю, что это имеет смысл. Код JS создали проблему, в первую очередь, и проблема будет решена несколькими строчками ниже в этом же файле. ИМО это лучше, чем решать проблему в отдельный CSS-файл, который может быть отредактирован другими людьми, которые Дон'т знаю, почему .пользовательский интерфейс-помощник-скрытые-доступного класса был изменен таким образом.