jquery의 .toggle() 함수를 "오버라이드"하는 가장 좋은 방법은 무엇입니까?

Question

토글 기능을 변경하여 "표시/숨기기"또는 "확장/축소"라고 링크 텍스트를 변경합니다.

함수 정의와 고전 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의 토글을 변경해야합니까, 내 자신을 만드십시오 ...)?

모든 포인터 또는 읽기 (책은 필요하지 않습니다. 아직 해결되지 않았습니다. :)) 감사합니다. 실제로 받아 들여지기 위해 함수 본문을 작성할 필요는 없습니다.

Answer 1

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');