name属性に角かっこがある入力用のjQueryセレクター


179

名前属性に角かっこがあるこの要素を選択しようとしています:

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

私はこれを試しました(動作しません):

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

そしてどちらもこれをしません:

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

またはこれ:

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

編集:あなたの一部が指摘したように、$('input[inputName=someValue]')決して機能しないでしょう。私は何をしようとしていたことでした:$('input[name=inputName][value=someValue]')。(ただし[]、name属性では)。

回答:


262

パーjQueryのドキュメント、これを試してみてください。

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

[編集]ただし、それがセレクターの正しい構文かどうかはわかりません。あなたはおそらく欲しい:

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

32
良いキャッチ。2つのバックスラッシュが必要な理由は、1つのバックスラッシュがJavaScript文字列のエスケープ文字として解釈されるためです。そのため、セレクターにエスケープ文字を提供するリテラルバックスラッシュを2つ指定する必要があります...ああ、複数レベルの文字の喜び脱出。
Peter

有難うございます。正規表現を使用するだけです。これは、お気に入りのビューフレームワーク内の配列またはリストにフォームデータを直接送信する場合に非常に役立ちます。また、複数の主キー要素を持つオブジェクトの削除に関する質問にも答えることができました。;)
LuizFeijãoVeronesi 2014年

79

バックスラッシュを使用して、jQueryセレクターで「面白い」文字を引用できます。

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

属性値には、引用符を使用できます。

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

さて、私はあなたの例に少し混乱しています。HTMLは正確にはどのように見えますか?特に「inputName」という文字列はどこに表示されますか?

固定ボゴシティを編集します。ありがとう@Dancrumb


1
私は(偶然にも選択タグ)<select name="foo[bar]">を使用して選択することはできませんが、を使用して選択する$('select[name=foo\\[bar\\]]')ことでき$('select[name="foo[bar]"])ます。
Frank Nocke 2013年

53

属性セレクター構文は[name=value]nameは属性名で、valueは属性値です。

したがって、次の値を持つinput属性nameを持つすべての要素を選択する場合inputName[]

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

また、2つの属性(ここでは:namevalue)を確認する場合は、次のようにします。

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

7

セレクターが変数内に含まれている場合、以下のコードが役立つ場合があります。

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\\]

この場合、すべての特殊文字の前に二重のバックスラッシュを付けます。


1
selector.replace(/([|])/ g、 '\\\\ $ 1'); エスケープスラッシュが追加され、1つのエスケープスラッシュではなく2つのスラッシュが生成されるため、私にとっては少しうまくいきました...
Fydo

ちょうどあなたも同様コロン、ピリオドを含むいくつかの他の文字をエスケープする必要があることを覚えておいてください@Fydo
エリックKigathi

1

異なる引用符で区切るだけです。

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

jQuery:

var value = $('input[name="myName[1][data]"]').val();
弊社のサイトを使用することにより、あなたは弊社のクッキーポリシーおよびプライバシーポリシーを読み、理解したものとみなされます。
Licensed under cc by-sa 3.0 with attribution required.