新米エンジニアの失敗再発防止メモ

自分そしてこの世界の皆が、同じ失敗をしないためのメモ

Twitterやってます!@rakuton_t
欲しいものリストのブタメンを送ってくれた方、ありがとうございます!

jQueryでエラー: Uncaught Error: Syntax error, unrecognized expression

「Uncaught Error: Syntax error, unrecognized expression」

個のバグで少々悩まされたので、次は悩まないようにメモしておく。

原因

JQueryのバージョンによっては、
要素のidに以下の記号が含まれている場合、セレクタの書き方を変えなくてはならない。
[ #;&,.+*~\':"!^$[\]()=>|\/@]

解決策

例えば以下のような要素を取得したい場合

<a href="te$$st">ほげほげ</a>

以下のように、記号を引用符で囲んだセレクタで取得すれば良い。

$('a[href="te$$st"]')

また、findを使った場合はエスケープが必要な場合がある。
こちらのサイトで教えてくださっている正規表現など、そのまま使えるのでおススメです。
stackoverflow.com
上記サイト引用

var sel = "[id='" + theID.replace(/([ #;&,.+*~\':"!^$[\]()=>|\/@])/g,'\\$1') + "']"

記号の意味

これだけだと味気ないので、上記のreplace関数で使われている記号の意味を解説しようと思う。
$1(ドルマーク1):1つ目の括弧で囲まれた正規表現にマッチした文字列を表す。

今回は、括弧は一つしかないので、1つ目とは
([ #;&,.+*~\':"!^$[\]()=>|\/@])
これのことだ。
これを、'\\$1'にリプレースしているので、例えば & がマッチすれば、 \& に変換されてエスケープしてくれる。



$(ドルマーク)とかの記号って検索できないから面倒だよね...

私の記事が役に立ったら、どうぞ何か買ってください!→ Amazon欲しいものリスト