2009-08-27 9 views
1

私はそれが「表示/非表示」または「拡大/縮小」を言うために、リンクのテキストを変更するようにトグル機能を変更したいです。jqueryの.toggle()関数を「オーバーライドする」最良の方法は何ですか?

関数の定義とクラシックJSに呼び出すには、次のようになります。

function myToggle(expandText, collapseText, id,o){ 
    // expandText: "expand", "show", "display" 
    // collapseText: "collapse", "hide" 
    // id: the id of the div to toggle 
    // o: the object from where the function has been called 
} 

私は、そのように呼び出します。

<a href="#" onclick="myToggle('Show','Hide', 'myId', this); return false;">Show the div</a> 
<div id='myId'>Hi!</div> 

それは "によって「ショー」の文字列の置き換えを行うだろう「非表示」にしてdiv()を表示します。もう一度クリックすると前の状態に戻ります。かなり簡単なもの、それは問題ではありません。


私はjqueryが初めてですが、私はすでにそれを愛しています。私はこのようなものを作成するきれいな方法があることを知っていますが、私はそれを使用する方法がわかりません...

質問は:どのように定義し、そのような関数を呼び出しますか?それを行うための最高のクリーンな方法は何ですか(私はjqueryのトグルを変更する必要があります、自分自身を作成する...)?

任意のポインタまたは(何冊が、私はまだ:)それが今日行わ取得する必要はありませんしてください)まで読んだが理解されるであろう。受け入れられるように実際に関数本体を書く必要はありません。

答えて

2

あなたはwrite your own pluginをできました。

jQuery.fn.myToggle = function(show, hide, id) { 
    return this.each(function() { 
     var $href = $(this); 
     $href.click(function(evt) { 
      var text = $href.text(); 
      if (text.indexOf(show) > -1) { 
       $href.html(text.replace(show,hide)); 
      } 
      else { 
       $href.html(text.replace(hide,show));  
      } 
      $("#" + id).toggle(); 
      evt.preventDefault(); 


     }); 

    }); 
}; 



$('#clicky').myToggle('show','hide','myId'); 
+0

おかげで、クールに聞こえます!あなたは何を意味するか – marcgg

+0

ギミかかわら秒を「ノードAにクリックで接続する」と私はそれを肉付けます。 – seth

+0

ああ、完璧!おかげでたくさん – marcgg

関連する問題