jQuery プラグイン開発ガイド_jquery

まずは、最もオーソドックスな jQuery プラグインの定義方法を簡単に見てみましょう。

コードをコピーします コードは次のとおりです:

(関数($) {
$.fn.プラグイン名 = 機能 (設定) { //デフォルトパラメータ
vardefaultSettings = {

/*デフォルトのパラメーターとユーザー定義のパラメーターをマージします
設定 = $.extend(defaultSettings, settings);

return this.eact（function（）{
} })(jQuery);



まず、テンプレートのコードの最初の行を見てみましょう (もちろん、このコード行の後半を取り出して一緒に読む必要があります。そうしないと、最初の行はまったく意味がなくなってしまいます)。

コードをコピーします コードは次のとおりです: (関数 ($) {

})(jQuery);



このコード行は、実際には匿名関数を作成するために使用されます。匿名関数とクロージャを理解していないと、この種のコードについて非常に混乱することになるため、この記事 [

JavaScript の匿名関数とクロージャの詳細について説明します] を読むことを強くお勧めします。

jQuery の継承メソッド $.extend —— $.extend は jQuery プラグイン開発において非常に重要な役割を果たし、パラメータをマージするために使用されます。

コードをコピーします コードは次のとおりです: $.fn.tip = 機能(設定) {

vardefaultSettings = { //色

色: '黄色'、
//遅延
タイムアウト: 200 }
/* デフォルトパラメータとユーザー定義パラメータをマージします */
設定 = $.extend(defaultSettings, 設定); アラート(設定.入力);
}



jQuery プラグインは 2 番目の方法を定義します:

コードをコピー

コードは次のとおりです:

(関数 ($) {
    //插件定义--更换名字
    $.fn.tabpanel = 関数 (メソッド) {
        var メソッド = $.fn.tabpanel.methods;
        if (メソッド[メソッド]) {
            return メソッド[メソッド].apply(this, Array.prototype.slice.call(arguments, 1));
        } else if (メソッドのタイプ === 'オブジェクト' || !メソッド) {
            return Methods.init.apply(this, argument);
        } else {
 
        }
    }
    //サポートされるメソッド
    $.fn.tabpanel.methods =
    {
        //初期化
        init: 関数 (p_options) {
            tabpanelBind(p_options, this);
        }、
        追加: 関数 (p_options) {
            addTab(p_options, this);
            tabpanelBind(p_options, this);
            // デバッガ
        } }
    関数 add(p_options) {
        var _defaults = {
            id: ""
        }
   
　　　　//内部实现略.....
        return _index;
    }

})(jQuery);

调用 $("#team").tabpanel('add',"");

好了、上面介在のこの 2 つの公開方式はすべて最もよく使用され、小伴们先好好学习下吧、後续我们再介绍のより深入りなこれら