Topics インフォコネクト最新情報

「Uncaught Error: Syntax error, unrecognized expression: a[href^=#]」jQueryのエラー対処方法

2023.05.10

インフォコネクト・スタッフブログ

こんにちは、チーフクリエイターのSHOJIです。
今回は、jQueryに関する相談についてご紹介させていただきます。

相談の内容としては、
「デベロッパーツールで『Uncaught Error: Syntax error, unrecognized expression: a[href^=#]』と表示されているのに気付いたが、原因と対象方法が分からない」というものでした。

参考までに、相談者の環境を掲載しておきます。

OS：Windows 11 Pro
jQuery：3.6.1
ブラウザ：Google Chrome 100.0.4896.60

エラーの原因はjQueryのバージョンを上げたことによるもので、jQuery1系で使われていたスムーススクロール用の記述が、jQuery3系では有効な記述ではなかったためエラー表示されました。

「Uncaught Error: Syntax error, unrecognized expression: a[href^=#]」jQueryのエラー対処方法

jQuery2系以降に対応するよう記述を変更します。

上記のように、アンカーリンクのセレクタ部分をダブルクォーテーション（""）で囲んであげると解決することができます。（※コード１行目）

今回は、jQueryのバージョン違いによって生じたエラーとその解決方法についてご紹介しました。

ネットで古くから紹介されている「スムーススクロールの実装」に関して、jQuery1系の記述コードをそのままコピペするだけではなく、基本的なjQuery1系・jQuery2系.jQuery3系の記述方法やその違いについても学んでおく必要があると思います。

［Webの豆知識］関連記事

経営コンサルティングからITサービス活用支援、ホームページ制作などに関するご依頼や、ご質問・ご相談など、なんでもお気軽にお問い合わせください。