2012-05-04 19 views
2

私はtogglebuttonという名前の簡単なjqueryプラグインを作成しています。私の質問は一番下にあります。 ここにコードがあります。すべてのヘルプははるかに高く評価されてjqueryプラグインを作成する際の助けが必要です

$('#crop').togglebutton({ 
    state:'off', 
    click: function(event, ui) { 
     val = ui.value; 
    } 
}); 

/** CSS */ 
.toggle-button{ 
    -moz-border-radius:4px; 
    border-radius:4px; 
    border:solid gray 1px; 
    padding:4px; 
    color:#fff; 
} 
.state-on{ background:gray; } 

.state-off{ background:blue; } 


/** JQuery Plugin Definition */ 
jQuery.fn.togglebutton = function (options) { 
    myoptions = jQuery.extend ({ 
    state: "off", 
    }, options); 

    this.click(function(){ 
     myoptions.click; 
     opt = options; 
     $this = $(this); 
     if(opt.state == 'on'){ 
      turnoff($this); 
      opt.state = 'off'; 
     } 
     else if(opt.state == 'off'){ 
      turnon($this); 
      opt.state = 'on'; 
     } 
    }); 

    this.each(function() { 
     this.options = myoptions; 
     $this = $(this); 
     opt = this.options; 

     if(opt.state == 'on'){ 
      $this.attr('class', "toggle-button state-on"); 
     } 
     else if(opt.state == 'off'){ 
      $this.attr('class', "toggle-button state-off"); 
     } 

    }); 

    function turnon($this){ 
     $this.attr('class', "toggle-button state-on"); 
    } 
    function turnoff($this){ 
     $this.attr('class', "toggle-button state-off"); 
    } 
} 

/** How to Call */ 
$('#crop').togglebutton({state:'off'}); 

は、私は私のjQueryプラグインの定義に追加されますどのようなので、私のようなもの、それを呼び出すことができます。私はこの物語の初心者です。開始する

答えて

1
$.fn.hello = function(options) { 

    return this.each(function() { 

    }); 
}; 

その後、uは方法を以下に上記のプラグインを使用することができますを実装するのは非常に簡単です。 。

$('.tip').hello(); 
関連する問題