Heim  >  Artikel  >  Web-Frontend  >  Detaillierte Beispiele für vier Verwendungsszenarien von jquery.proxy

Detaillierte Beispiele für vier Verwendungsszenarien von jquery.proxy

零下一度
零下一度Original
2017-06-17 17:47:241615Durchsuche

Tatsächlich gibt es nur zwei Möglichkeiten, es zu verwenden, aber jede davon ist in die Übergabe von Parametern unterteilt.

Geben Sie mir zuerst ein Stück HTML, das später zum Testen verwendet wird:



1, jquery.proxy(function, context);

Kontext als Funktionsausführungskontext verwenden (d. h. dies)

2, jQuery.proxy(function, context [, zusätzlicheArguments]);

Parameter an Funktion übergeben

Verwendung Szenario: Wenn Sie auf klicken, übergeben Sie zum Ausführen der Funktion im angegebenen Kontext zwei Parameter gleichzeitig. Wenn ein Ereignis erforderlich ist, kann es als dritter Parameter der Funktion verwendet werden.

Hinweis: Wenn Proxy in der Funktionsausführungsumgebung nicht anwendbar ist, ist der Kontext das aktuell angeklickte Objekt . Da nun andere Kontexte angegeben sind, hat dies nichts mit dem aktuell angeklickten zu tun Objekt.

 var me = {
   /* I'm a dog */
   type: "dog",
   
   /* Note that event comes *after* one and two */
   test: function(one, two, event) {
     $("#log")
       /* `one` 是第一个附加参数,与对象`you`对应 */
       .append( "<h3>Hello " + one.type + ":</h3>" )
       /* `two` 是第二个附加参数,与对象`they`对应 */
       .append( "and they are " + two.type + ".<br>" )
       /* `this` 是上下文,与普通对象`me`对应 */
       .append( "I am a " + this.type + ", " )
  
       
       /* 事件类型是点击"click" */
       .append( "Thanks for " + event.type + "ing " )
       /* `event.target`是被点击元素,类型是按钮button */
       .append( "the " + event.target.type + "." );
   }
 };
  
 var you  = { type: "cat" };
 var they = { type: "fish" };
  
 
 /* 一共4个参数:第一个是function,第二个是context,第三、四是参数 */
 var proxy = $.proxy( me.test, me, you, they );
 
 $("#test").on( "click", proxy );
 /* 运行结果:
 Hello cat:
 and they are fish.
 I am a dog, Thanks for clicking the submit.
 */

In diesem Fall entspricht der Klick lediglich einer Auslösetaste, und die nach dem Auslösen ausgeführte Funktion hat nichts mit dem Klick zu tun.

3, jQuery.proxy(context, name);

Verwendungsszenario: Kontext ist ein einfachesObjekt, Name ist seine Methode. Es wird beim Klicken ausgeführt, aber der Ausführungskontext der Testfunktion ist obj, nicht $("#test")

 var obj = {
     name: "John",
     test: function() {
         console.log(this);
         $("#log").append( this.name );
         $("#test").off("click", obj.test);
     }
 };
 $("#test").on( "click", jQuery.proxy( obj, "test" ) );//在click时执行,但又
不是click的上下文

Ergebnisanalyse: Nach dem Binden des Klickereignisses beim ersten Mal ausgeführt wird, wird die Bindung entfernt.

Nach dem Entfernen gibt es kein Klickereignis für die Schaltfläche. Wenn Sie also erneut auf die Schaltfläche klicken, erfolgt keine Reaktion.

4, jQuery.proxy(context, name [, zusätzlicheArguments]);

Eine Frage:

Lassen Sie mich Ihnen eine Frage stellen,

jQuery .proxy (context, function, params);

und

function.call(context, params);


Das obige ist der detaillierte Inhalt vonDetaillierte Beispiele für vier Verwendungsszenarien von jquery.proxy. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

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