J’essaie de créer un script générique autocomplete à l’aide de jQueryUI. La saisie semi-automatique devrait fonctionner pour chaque:
...
Maintenant, j’essaie d’accéder à ‘foo’ ou ‘bar’ dans la fonction source en utilisant $ (this), mais quand je suis en alerte, je suis toujours ‘non défini’.
$('input.autocomplete').autocomplete({ source: function(req, add){ var id = $(this).attr('id'); alert(id); } });
Qu’est-ce que je fais mal?
Configurez la saisie semi-automatique séparément pour chaque élément de votre sélection, en utilisant une fermeture pour contenir une référence à l’élément en question. Quelque chose comme ce qui suit:
$('input.autocomplete').each(function(i, el) { el = $(el); el.autocomplete({ source: function(req, add) { var id = el.attr('id'); alert(id); } }); });
Alternative (éditer)
Je ne vois pas pourquoi il y a une telle résistance à utiliser each()
: cela fonctionne, le code est très clair et lisible, et il ne pose aucun problème d’efficacité; mais si vous êtes déterminé à éviter each()
, voici une alternative …
* VEUILLEZ NOTER: l’approche suivante repose (un peu) sur les éléments internes de jQuery Autocomplete, donc je recommanderais la première option … mais le choix vous appartient.
$('input.autocomplete').autocomplete({ source: function(req, add) { var id = this.element.attr('id'); alert(id); } }); });
Cela fonctionnera, du moins jusqu’à / à moins qu’ils ne changent la façon dont la fonction source()
est appelée depuis le plugin autocomplete
.
Donc, vous avez deux options … quelque chose pour tout le monde.
Pour accéder à cet élément d’entrée, vous devriez pouvoir effectuer les opérations suivantes:
$(this.element).val();
Bien sûr, cela ne fait que gagner de la valeur. Vous pouvez accéder aux autres atsortingbuts comme ceci:
$(this.element).attr('value'); // just another way to get the value $(this.element).attr('id');
De plus, supposons que vous souhaitiez accéder à cet élément dans l’ événement select , vous pouvez le faire comme suit:
$(event.target).attr('value'); $(event.target).attr('id');
$(this)
viendra de votre fonction nouvellement créée et ne fonctionnera donc pas. Déplacez votre déclaration d’ id
au-dessus de la source
et cela devrait fonctionner.
Marwelin a raison. ‘this’ fera référence à la fonction nouvellement créée dans laquelle vous êtes nested. Ceci est facilement réparable en créant le var id
dehors de la fonction et en l’utilisant dans la fonction.