WordPress5.6にアップデートしたら一部のjQueryが動かなくなった際の対処方法

WordPressの最新版（バージョン5.6）が2020年12月9日にリリースされました。
アップデートに伴い、私が管理しているいくつかのサイトで不具合が出たので、その対処方法をメモとして残します。

【現象】バージョン5.6に更新したらjQueryが動かなくなった！？

WordPressの最新版（5.6）への更新を行ったところ、jQueryの一部プログラムが動かなくなりました。
私が経験した不具合としては、下記のような箇所が機能しなくなりました。

jQuery(function ($) {
  $(window).on('load', function() {
    // ロード完了時の処理 ← ここが機能しない
  });
});

以前までは「$(window).on(‘load’, function() { });」の箇所が正常に機能していて、ロード完了時にページ内の処理を行っていたのですが、バージョンアップ後は処理が行われずにページの内容がバグっていました。

不具合のキッカケはWordPressのバージョンアップしか考えられなかったので、バージョン5.6の仕様変更を調べてみると、下記のような記事を発見しました。

• WordPress同梱のjQueryがついに最新版にアップデート
• 2020年12月のWordPress 5.6でWebサイトが壊れる可能性

ざっくりと説明すると、WordPressバージョン5.6からデフォルトのjQueryの読み込みが1.x系から3.x系に変更されたようです。

上記変更により、先ほどのjQueryの記述方法ではload関数が機能しなくなったようです。
参考記事：$(window).on (‘load’)関数が動作しない時はjQueryのバージョンをチェック！

WordPressでjQueryを使用する場合は「jQuery(function ($)」で括って使う事がクセになっていたので、この仕様変更はちょっと痛手でした…。

不具合の解消方法は？

今回の不具合に関して、早急に解決できる方法としては下記2点が考えられます。

1. jQuery3.x系を読み込ませないようにして、 jQuery1.x系や2.x系を別途読み込む
2. jQuery3.x系で不具合が起きないようにスクリプトの記述を変更する

最も簡単な修正方法は1なのですが、今後のことを考えると2の方法を取ったほうが良いですね。
なので、取り急ぎ解決するのであれば1の方法で対応して、後々2の方法でちゃんと対応したほうが良さそうです。

※1の実装方法は下記記事辺りが参考になると思います。
・【WordPress】headタグ内のjQueryを読み込ませない（削除する）ようにする方法

ということで、私は2の方法を採用して下記のような記述に直しました。

jQuery(function ($) {
  // ロード以外の処理
});

jQuery(window).on('load', function() {
  // ロード完了時の処理
});

なんだか少し間の抜けた書き方になったのが気になりますね…。
もっと良い記述方法はないものか…。

とりあえず上記で動くことは確認できたので、対処方法の一つとして参考になればと思います。

補足になりますが、jQuery3.x系で影響のある関数は下記記事で上手にまとめられていたので、気になる方はチェックしてみてください。
参考記事：WordPress 5.6はjQuery 3.5.1になるので「これ」があったら要注意