Heim >Web-Frontend >js-Tutorial >Lernen Sie, in 10 Minuten ein Beispiel-Tutorial für ein JQuery-Plug-In zu schreiben_jquery

Lernen Sie, in 10 Minuten ein Beispiel-Tutorial für ein JQuery-Plug-In zu schreiben_jquery

WBOY
WBOYOriginal
2016-05-16 16:36:581036Durchsuche

Viele Freunde haben jQuery-Plug-Ins verwendet, aber nur wenige Leute haben selbst jQuery-Plug-Ins geschrieben. Dieser Artikel beschreibt kurz die Implementierungsmethode von jQuery-Plug-Ins in Form von Beispielen. Teilen Sie es als Referenz mit allen. Die spezifische Methode ist wie folgt:

Insbesondere kapselt es einige häufig verwendete, praktische und allgemeine Funktionen. Vereinfacht ausgedrückt bedeutet dies, dass diese Codes in eine Methode eingefügt werden, um den Effekt einer wiederholten Verwendung zu erzielen, sodass Sie sie nicht jedes Mal verwenden müssen Ich muss diese Funktion jedes Mal neu schreiben.

Nachdem Jquery nun das Konzept von Plug-Ins hinzugefügt hat, müssen Sie es nur noch entsprechend seinem spezifischen Format schreiben, genau wie Sie normalerweise Funktionen schreiben, aber es ist nicht allzu kompliziert. Es liegt an Ihnen, es zu glauben oder nicht, aber ich glaube es.

Als nächstes werde ich es mit einfachem Code erklären. Wenn Sie nach dem Lesen nicht wissen, wie man ein Plug-In schreibt, kann ich nur sagen, dass ich sprachlos bin

Die spezifischen Schritte sind wie folgt:

Schritt 1: Definieren Sie das Plug-in

$(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); 
   }); 
  } 
}); 
 

Schritt 2: Plug-in aufrufen

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

Jetzt ist das einfachste Plug-in fertig! Weniger als 10 Minuten! Ich glaube, jeder sollte es verstehen! So einfach ist das jQuery-Plug-in.

Stellungnahme:
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn