Comment faire pour supprimer/changer de JQuery UI Autocomplete Helper texte?
Il semble que c'est une nouvelle fonctionnalité dans l'INTERFACE utilisateur de JQuery 1.9.0, parce que j'ai utilisé JQuery UI beaucoup de fois avant, et ce texte ne jamais poped vers le haut.
Ne pouvais pas trouver tout ce qui est lié sur la documentation de l'API.
En utilisant une base de saisie semi-automatique exemple avec une source locale
$( "#find-subj" ).autocomplete({
source: availableTags
});
Lorsque les résultats de la recherche qu'il montre ce helper texte:
'1 résultat est disponible, utilisez les flèches haut et bas pour naviguer.'
Comment puis-je désactiver dans une jolie manière de, pas en l'enlevant avec des sélecteurs JQuery.
- dans le navigateur voyez-vous cela ? êtes-vous capable de voir la même boîte de dialogue de l'interface utilisateur de jquery site web
- Je n'ai jamais vu cela, vous pouvez éventuellement fournir un violoniste ou un code supplémentaire afin que nous puissions regarder de plus?
- pour moi, le problème était que le position: relative, a été remplacée pour la durée sur laquelle l'accessibilité des trucs a l'affichage... j'ai juste ajouté "!important" et maintenant, je peux garder l'accessibilité
- Votre doute sauvé mon temps. Donc +1 pour vous 🙂
Vous devez vous connecter pour publier un commentaire.
Je sais que cela a été asnwered mais je voulais juste donner un exemple de mise en œuvre:
source: availableTags
n'? Je l'ai enlevé et j'ai toujours pas eu de messages.availableTags
pourrait être une variable locale contenant un objet JSON de l'url de mot de cartographie[{ '/tag/cats': 'Cats', etc... }]
Ainsi, lorsque l'utilisateur tapeCa
Chats s'affichera dans la liste déroulante et lorsqu'il est sélectionné ou cliquez dessus, il est possible de remplir un champ caché avec l'url par exemple.Ce est utilisé pour l'accessibilité, un moyen facile de dissimuler c'est avec CSS:
Ou (voir Daniel de commentaire ci-dessous)
left: -9999px
, vous pouvez également utiliserleft: 200%
(200% contre 100% pour tenir compte d'éventuelles navigateur bizarreries où 100% n'est pas tout descendre au bas de l'écran).Le haut de réponse ici atteint l'effet visuel désiré, mais réduit à néant l'objet de jQuery avoir ARIA de soutien, et c'est un peu dickish pour les utilisateurs qui comptent sur elle! Ceux qui l'ont déjà mentionné que jQuery CSS cache cela pour vous corriger, et c'est le style qui fait que:
Copie dans votre feuille de style au lieu de supprimer le message, s'il vous plaît :).
clip
bien, comme c'est désormais obsolète - voir developer.mozilla.org/en-US/docs/Web/CSS/clipSelon ce blog:
Donc, si vous allez à github et de regarder la la saisie semi-automatique du code source, autour de la ligne 571, vous verrez où cela est réellement mis en œuvre.
L'ajout de jquery css a également travaillé pour supprimer le texte d'instruction.
Puisque c'est là-bas pour des raisons d'accessibilité, il est probablement préférable de la cacher avec les CSS.
Cependant, je suggère:
Plutôt que:
Que l'ancienne permet de masquer l'élément hors de l'écran, mais encore de permettre à des lecteurs d'écran pour le lire, alors que
display:none
ne pas.left: -9999px
, il suffit d'utiliserleft: 200%
(200% contre 100% pour tenir compte d'éventuelles navigateur bizarreries où 100% n'est pas tout descendre au bas de l'écran).Bien, cette question est un peu plus âgés, mais le texte n'est pas à tous, lorsque vous incluez le fichier css:
Bien sûr, vous devez insérer un thème réel au lieu de
YOUR_THEME_HERE
par exemple, "la douceur"L'ajout de ce code juste après la saisie semi-automatique dans votre script va pousser l'ennuyeux helper hors de la page, mais les personnes qui utilisent des lecteurs d'écran sera encore en bénéficier:
Je ne suis pas un fan de la manipulation de CSS avec JS, mais dans ce cas je pense que cela a du sens. Le code JS créé le problème en premier lieu, et le problème sera résolu en quelques lignes ci-dessous dans le même fichier. IMO c'est mieux que de résoudre le problème dans un autre fichier CSS qui peuvent être modifiées par d'autres personnes qui ne savent pas pourquoi .ui-helper-hidden-accessible de la classe a été modifiée de cette façon.
left: -9999px
, il suffit d'utiliserleft: 200%
(200% contre 100% pour tenir compte d'éventuelles navigateur bizarreries où 100% n'est pas tout descendre au bas de l'écran).Style comment le jQuery thème lui-même styles. Beaucoup d'autres réponses suggèrent y compris l'ensemble de la feuille de style, mais si vous voulez juste pertinentes CSS, c'est la façon dont c'est fait dans
http://code.jquery.com/ui/1.9.0/themes/smoothness/jquery-ui.css
:Le jQuery, CSS .ui-helper-caché-est accessible dans les thèmes/base/core.fichier css. Vous devez inclure ce fichier (au minimum) dans vos feuilles de style pour la compatibilité ascendante.