京都のシステム開発・ホームページ制作会社　株式会社Nextat（ネクスタット）

こんにちは、スズキです。

今回はjQueryで既存関数を実行する際に共通の処理を追加で行うようにする方法を紹介します。
なお、今回は短めです。

先日、とある既存システムに対して不具合対応を行いました。
各画面で共通に呼び出される部分を修正することで対応することにしたのですが、
動作確認してみたらjQueryのhideメソッド呼び出し時にバグが発生するようになったのですよ。
そのため、「jQueryのhideメソッド呼び出し時は追加で特定の処理を行う」という対応が必要になりました。

そのような経緯からjQueryの既存関数実行時に特定の処理を追加で行う方法を調べることになりました。
というわけで、今回はそのとき行った対応方法を紹介します。

既存関数呼び出し時に共通の処理を追加で行う方法ですが、
jQueryのインスタンスメソッドは「$.fn」配下に格納されているので、以下のような記述を行えば既存関数呼び出し時に共通の処理を追加で行うことができるようになります。

    $.fn.hideOrigin = $.fn.hide;
    $.fn.hide = function() {
        // 本来のhide処理を実行
        $(this).hideOrigin();

        // 〜〜 ここに実行したい処理を記述 〜〜 //
    };