Sélecteur jQuery pour les entrées avec des crochets dans l'attribut de nom

180

J'essaie de sélectionner cet élément qui a des crochets dans l'attribut de nom:

<input type="text" name="inputName[]" value="someValue">

J'ai essayé ceci (qui ne fonctionne pas):

$('input[inputName[]=someValue]')

et cela non plus:

$('input[inputName&#91;&#93;=someValue]')

ou ca:

$('input["inputName[]"=someValue]')

EDIT: Comme certains d'entre vous l'ont souligné, $('input[inputName=someValue]')ne fonctionnerait jamais. Ce que je voulais faire était: $('input[name=inputName][value=someValue]'). (Mais avec []dans l'attribut name).

— aidan
source

263

Selon la documentation jQuery , essayez ceci:

$('input[inputName\\[\\]=someValue]')

[EDIT] Cependant, je ne suis pas sûr que ce soit la bonne syntaxe pour votre sélecteur. Vous voulez probablement:

$('input[name="inputName[]"][value="someValue"]')

— Dancrumb
source

32

Bonne prise. La raison pour laquelle deux barres obliques inverses sont nécessaires est qu'une seule barre oblique inverse est interprétée comme un caractère d'échappement de chaîne JavaScript, vous en avez donc besoin de deux pour spécifier une barre oblique inverse littérale, qui fournit le caractère d'échappement au sélecteur ... ah, les joies de plusieurs niveaux de caractère s'échapper.

— Peter

Merci pour ça. Il s'agit simplement d'utiliser des expressions régulières. Ceci est très utile lorsque vous soumettez des données de formulaire directement à un tableau ou une liste dans votre cadre de vue préféré. Cela m'a également aidé à répondre à la question sur la suppression d'objets avec plusieurs éléments de clé primaire. ;)

— Luiz Feijão Veronesi

79

Vous pouvez utiliser une barre oblique inverse pour citer des caractères "amusants" dans vos sélecteurs jQuery:

$('#input\\[23\\]')

Pour les valeurs d'attribut, vous pouvez utiliser des guillemets:

$('input[name="weirdName[23]"]')

Maintenant, je suis un peu confus par votre exemple; à quoi ressemble exactement votre HTML? Où apparaît la chaîne "inputName" en particulier?

modifier la bogosité fixe; merci @Dancrumb

— Pointu
source

1

Je ne suis pas en mesure de sélectionner (par coïncidence une balise de sélection) en <select name="foo[bar]">utilisant, $('select[name=foo\\[bar\\]]')mais je suis capable de le faire en utilisant $('select[name="foo[bar]"]), votre deuxième suggestion.

— Frank Nocke

53

La syntaxe du sélecteur d'attribut correspond à l' [name=value]emplacement namedu nom de l'attribut et à valuela valeur de l'attribut.

Donc, si vous souhaitez sélectionner tous les inputéléments avec l'attribut nameayant la valeur inputName[]:

$('input[name="inputName[]"]')

Et si vous souhaitez vérifier deux attributs (ici: nameet value):

$('input[name="inputName[]"][value=someValue]')

— Gombo
source

7

Si le sélecteur est contenu dans une variable, le code ci-dessous peut être utile:

selector_name = $this.attr('name');
//selector_name = users[0][first:name]

escaped_selector_name = selector_name.replace(/(:|\.|\[|\])/g,'\\$1');
//escaped_selector_name = users\\[0\\]\\[first\\:name\\]

Dans ce cas, nous préfixons tous les caractères spéciaux avec une double barre oblique inverse.

— Eric Kigathi
source

1

selector.replace (/ ([|]) / g, '\\\\ $ 1'); a un peu mieux fonctionné pour moi car il ajoute les barres obliques échappées et produit deux, pas une barre oblique d'échappement ...

— Fydo

@Fydo, rappelez-vous simplement que vous devez également échapper à d'autres personnages, y compris les deux points, les points également

— Eric Kigathi

1

Séparez-le simplement avec des guillemets différents:

<input name="myName[1][data]" value="myValue">

JQuery:

var value = $('input[name="myName[1][data]"]').val();

— slva2000
source