jQuery でページ内リンクをスムーズスクロール

WordPress を 4.5 へアップデートしたら、自作のテーマ内で使用しているスムーズスクロールをするための JavaScript でエラーが発生した。

Error: Syntax error, unrecognized expression: a[href^=#]:not([href=#]) jQuery のバージョンが 1.12 になったことで厳密にエラーチェックされるようになったようだ。

公式ドキュメントを確認すると、属性セレクターの値は、『引用符で囲まれていない単一の単語または引用符で囲まれた文字列のいずれかを指定』（和訳）とある。シャープ(#) は単語ではないので引用符で囲まなければならないようです。

よって、修正すると、

a[href^="#"]:not([href="#"])

このようになります。

修正ついでに、そのスクリプトを公開します。

これは、ページ内リンクをスムーズスクロール スクリプトです。

smooth-scroll.js

/*jslint browser: true*/
/*global jQuery*/
;
(function ($) {
  'use strict';

  $(document).ready(function () {
    $('a[href^="#"]:not([href="#"])').click(function () {
      var target, targetOffset;

      jQuery.easing.quart = function (x, t, b, c, d) {
        return -c * ((t = t / d - 1) * t * t * t - 1) + b;
      };
      if (location.pathname.replace(/^\//, '') === this.pathname.replace(/^\//, '') && location.hostname === this.hostname) {
        target = $(this.hash);
        target = (target.length && target) || $('[name="' + this.hash.slice(1) + '"]');
        if (target.length) {
          targetOffset = target.offset().top;
          $('html,body').animate({ scrollTop: targetOffset }, 'normal', 'quart');
          return false;
        }
      }
    });
  });
}(jQuery));

このスクリプトを組み込むだけで、すべてのページ内リンクがスムーズスクロールするようになります。