>  기사  >  웹 프론트엔드  >  10분 안에 Jquery 플러그인 예제 튜토리얼 작성 방법을 알아보세요._jquery

10분 안에 Jquery 플러그인 예제 튜토리얼 작성 방법을 알아보세요._jquery

WBOY
WBOY원래의
2016-05-16 16:36:581012검색

jQuery 플러그인을 사용해 본 친구들은 많지만, jQuery 플러그인을 직접 작성해 본 사람은 거의 없습니다. 이 글에서는 jQuery 플러그인의 구현 방법을 예시 형식으로 간략하게 설명합니다. 참고할 수 있도록 모든 사람과 공유하세요. 구체적인 방법은 다음과 같습니다.

구체적으로 말하면 실제로 일반적으로 사용되는 실용적이고 일반적인 기능을 캡슐화한다는 의미입니다. 간단히 말해서 반복 사용 효과를 얻기 위해 이러한 코드를 매번 사용할 필요가 없도록 하는 것입니다. 매번 이 함수를 다시 작성해야 합니다.

이제 Jquery에 플러그인 개념이 추가되었으니 일반적인 함수 작성처럼 특정 형식에 따라 작성하기만 하면 되지만 그렇게 복잡하지는 않습니다. 믿거나 말거나는 여러분의 몫이지만 저는 그렇습니다.

다음으로 간단한 코드로 설명하겠습니다. 읽어보시고 플러그인 작성 방법을 모르시면 그냥 말문이 막힐 뿐입니다

구체적인 단계는 다음과 같습니다.

1단계: 플러그인 정의

$(function() { 
  $.fn.插件名称 = function(options) { 
   var defaults = { 
     Event : "click",    //触发响应事件 
     msg : "Holle word!"    //显示内容 
   }; 
   var options = $.extend(defaults,options); 
   var $this = $(this);    //当然响应事件对象 
   //功能代码部分 
   //绑定事件 
   $this.live(options.Event,function(e){ 
     alert(options.msg); 
   }); 
  } 
}); 
 

2단계: 플러그인 호출

$(function() { 
  //绑定元素事件 
  $("#test").插件名称({ 
   Event : "click",    //触发响应事件 
   msg : "插件原来就是这么简单!"   //显示内容 
  }); 
}); 
 

이제 가장 간단한 플러그인이 완성되었습니다! 10분 미만! 나는 모두가 그것을 이해해야 한다고 믿습니다! jQuery 플러그인은 이렇게 간단합니다.

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.