jquery.data를 사용하는 jquery 플러그인 패턴

Question

jquery 플러그인 패턴에서이 코드 조각을 보았으며 노트 섹션에서 jQuery.data 함수를 사용하여 DOM 요소에 플러그인을 첨부 할 수 있다고 언급했습니다. 내가 이해할 수없는 것은 어떻게이 코드를 사용 하는가입니다. 누군가이 기능을 사용하는 방법에 대한 예제를 제공하고 그 중요성을 설명 할 수 있습니까?

$.fn[pluginName] = function (options) { 
     return $Extend(this).each(function() { 
      if (!$.data(this, 'plugin_' + pluginName)) { 
       $.data(this, 'plugin_' + pluginName, 
       new Plugin(this, options)); 
      } 
     }); 
    }; 

Answer 1

내가 제공 한 코드의 요점은 플러그인을 다시 초기화 할 수 없다고 생각합니다.

요소에서 처음으로 플러그인을 호출 할 때 data을 확인하여 속성이 'plugin_' + pluginName으로 설정되어 있는지 확인합니다. 그것이 있었다면, 그것은 더 이상 아무것도하지 않습니다. 설정되지 않은 경우 new Plugin() 메소드가 호출되어 data에 저장됩니다. 그렇게하면 플러그인 메소드로 쉽게 검색 할 수 있습니다. 모든 메소드는 $(this).data('plugin_' + pluginName)을 사용하여 해당 요소에 대한 플러그인을 검색합니다.

$(".class").specialPlugin({ 
    key1: "value1" 
}); 

$(".class2").specialPlugin({ 
    key23: "value23" 
}); 

그런 다음 각 요소의 데이터는 원래의 설정에 특별히 정보를 갖게됩니다

그래서 당신처럼,이 플러그인 통화를하고 싶은 경우. 실제로 data에 저장 무슨

은 어떤 new Plugin 반환하고, 쉽게 참조 할 수 있도록 여러 가지의 전체 객체하거나 원래 options 객체, 어디서나 다양합니다.