返回列表 發帖

自製jQuery plugin

您好:
請問有 自製jQuery plugin 的範例和說明嗎?
謝謝!

可參考 jace ju 的文章:

自製 jQuery Plugin
網址:http://www.jaceju.net/blog/?p=336 (Part 1)
http://www.jaceju.net/blog/?p=337 (Part 2)
作者:jace ju
部落格:網站製作學習誌
To infinity and beyond!

TOP

您好:
謝謝您!想再請問,我參考該網站實作
html
        <script type="text/javascript">
                $(function () {
                    var debugX = $('#debug');
                    $('.test').mytoolbox({
                        callback: function () {
                            debugX.html(debugX.html() + this.id + '<br />'); //(第2 debug.html()會累加)
                        }
                    });
                });
        </script>
------------------
$.fn.mytoolbox = function(settings) { //加入settings 參數

//_defaultSettings,它能幫我們在使用者沒有指定任何設定值給 settings 時,還能夠提供預設的設定值。
    var _defaultSettings = {
        callback: function () { alert(this.id); }
    };
       
        // extend 方法,將 settings 中有設定的值覆蓋掉 _defaultSettings 所設定的預設值
        //,再把結果存放在 _settings 這個變數中
    var _settings = $.extend(_defaultSettings, settings);
       
    return this.each(function() {
                /*現在我們在 _settings 中指定了一個 callback 項目 (預設是用 alert )
                  ,然後將它指定給 div 元素的 click 觸發器。 */
        $(this).click(_settings.callback);//html中的callback: function ()
    });
};
-------------------------
,請問
$('.test').mytoolbox(...)  是不是就是 $.fn.mytoolbox = function(settings)  
'.test')=settings ?
那要如何才會呈現出  callback: function () { alert(this.id); }

謝謝'

TOP

你的問題共三個嗎??

$.fn.mytoolbox = function(settings)  是定義 mytoolbox() 這個 plugin
$('.test').mytoolbox(...)  是使用這個 plugin

('.test') 是指所有 class 是 test 的元素,都套用這個 plugin

如果要呈現出預設的 callback,可以不要帶入 settings,例如:
$('.test').mytoolbox();
To infinity and beyond!

TOP

收到,謝謝您!

TOP

返回列表 回復 發帖