페이지의 여러 요소에 첨부 된 jQuery 플러그인의 속성 표시

Question

jQuery 플러그인의 공개 속성을 표시하려면 다음 구조가 권장/표준으로 제안되었습니다. 플러그인이 페이지에 여러 HTML 요소에 연결되어있는 경우

(function($) { 
    $.myPlugin = { 
     data: {} 
    }; 

    $.fn.myPlugin = function() { 
     return this; 
    }; 
})(jQuery); 

위의 예는 구문 $.myPlugin.data.

를 통해 '데이터'를 공개 후, 나는 그것이 동등으로 $ .myPlugin.data이 무효가 생각 정적 변수.

1. . 데이터가 특정 플러그인의 인스턴스와 관련되도록 플러그인을 작성하는 다른 방법은 무엇입니까?
2. 플러그인 외부의 코드를 통해이 속성을 참조하는 방법은 무엇입니까? 즉. 그 물건을 어떻게 읽나요?

Answer 1

이렇게하면 플러그인이 작동하는 각 요소에 데이터가 첨부됩니다.

(function($) { 
    $.fn.extend({ 
     myPlugin: function (options) { 
      var defaultConfig = {data: {}}; 
      return this.each(function() { 
       $(this).data(
        "myPlugin", $.extend(defaultConfig, options) 
       ); 
      }); 
     } 
    }); 
})(jQuery); 

는 예를 들어 다음과 같이 호출 할 때 :

$("div.foo").myPlugin({option: "value"}); 

각 <div class="foo">가 $(this).data("myPlugin")에서 사용할 수

{ 
    data: {}, 
    option: "value" 
} 

의 복사본을 가질 것이다.

Answer 2

콜백 기능 사용은 어떻게됩니까?

// external code 
$('.something').myPlugin({ 
    onLoad : function(object, data) { 
     // use data here 
    } 
});