web-dev-qa-db-fra.com

Trouver l'élément DOM par ID lorsque l'ID contient des crochets?

J'ai un élément DOM avec un ID similaire à:

something[500]

qui a été construit par mon Ruby on Rails application. Je dois être en mesure d'obtenir cet élément via jQuery afin que je puisse parcourir mon chemin vers le DOM pour supprimez le parent de son parent, qui a un ID variable auquel je n'ai pas accès au préalable.

Est-ce que quelqu'un sait comment je pourrais procéder? Le code suivant ne semble pas fonctionner:

alert($("#something["+id+"]").parent().parent().attr("id"));

Après une inspection approfondie, les éléments suivants:

$("#something["+id+"]")

renvoie un objet, mais lorsque j'exécute ".html ()" ou ".text ()" dessus, le résultat est toujours nul ou juste une chaîne vide.

Toute aide serait grandement appréciée.

javascriptjqueryruby-on-railsdom
72
Mike Trpcic

Vous devez échapper les crochets afin qu'ils ne soient pas comptés comme des sélecteurs d'attributs. Essaye ça:

alert($("#something\\["+id+"\\]").parent().parent().attr("id"));

Voir Caractères spéciaux dans les sélecteurs , en particulier le deuxième paragraphe:

Pour utiliser l'un des méta-caractères (tels que !"#$%&'()*+,./:;<=>?@[\]^``{|}~) comme partie littérale d'un nom, il doit être échappé avec deux barres obliques inverses: \\. Par exemple, un élément avec id="foo.bar", Peut utiliser le sélecteur $("#foo\\.bar"). La spécification CSS du W3C contient le ensemble complet de règles concernant les sélecteurs CSS valides . L'entrée de blog de Mathias Bynens sur séquences d'échappement de caractères CSS pour les identifiants est également utile.

100
karim79

Vous pouvez aussi faire

$('[id="something['+id+']"]')
9
steampowered

Les crochets ont une signification spéciale pour sélecteurs jQuery , les filtres d'attribut spécifiquement.

Échapper juste à ceux-ci et il trouvera votre élément bien

$( "#something\\[" + id + "\\]" )
9
Peter Bailey

Un identifiant ne peut pas inclure des crochets. C'est interdit par la spécification .

Certains navigateurs peuvent corriger et gérer les erreurs, mais vous devez corriger vos données au lieu d'essayer de traiter les mauvaises données.

9
Quentin

Essaye ça:

alert($("#something\\["+id+"\\]").parent()[0].parent()[0].attr("id"));
4
Tim S. Van Haren

"L'un des méta-caractères

!"#$%&'()*+,./:;<=>?@[\]^`{|}~

en tant que partie littérale d'un nom, il doit être échappé avec deux barres obliques inverses: \\.

Par exemple, un élément avec id = "foo.bar", peut utiliser le sélecteur

$("#foo\\.bar")

"[source: jquery doc ], et un élément avec id =" foo [bar] "(même s'il n'est pas valide pour W3C mais reconnu par JQuery), peut utiliser le sélecteur

$("#foo\\[bar\\]")

(Juste une réponse comme beaucoup d'autres, mais tous ensemble :))

3
Elvis Ciotti

Vous pouvez leur échapper en utilisant \\ ou vous pourriez faire quelque chose comme ça ...

$(document.getElementById("something[" + id + "]"))
3
Josh Stodola