Come gestisci gli eventi click all'interno di un plugin jQuery?

Question

Come gestisci gli eventi di clic all'interno di un plug-in? Una descrizione semplificata è che voglio avere un plugin che rilevi un clic e quindi aggiorni un altro elemento.

Esempio di utilizzo:

$("#some_id").myPlugin("another_id");

Esempio Plugin:

(function($){ 

    $.fn.myPlugin=function(update_id){ 

    .click({$(update_id).html("content_upated");}); 

    } 

})(jQuery); 

Non capisco come codificare l'evento .Click all'interno del plugin. Qualsiasi esempio sarebbe utile. Grazie.

Answer 1

Si dovrebbe fare due cose:

1. Utilizzare this fare riferimento gli elementi a cui il plugin viene applicata
2. Namespace your events, in modo che possano essere facilmente non legato dopo

Prova il seguente

(function($){ 

    $.fn.myPlugin = function(update_id) { 

     this.bind("click.myPlugin", function() { 
     $(update_id).html("content_upated"); 
     }); 

    }; 

})(jQuery); 

Si consiglia di leggere la pagina su jQuery plugin authoring per ulteriori informazioni su come sviluppare correttamente i plugin jQuery. Ti mancano altri dettagli importanti come accettare un oggetto argomenti.

Answer 2

(function($){ 
    $.fn.myPlugin=function(update_id){ 
     this.click(function(){ $(update_id).html("content_upated"); }); 
    } 
})(jQuery); 

Assicurarsi che update_id sia un selettore valido.

Answer 3

Si invoca .each() per iterare sugli elementi corrispondenti, oppure è possibile allegare tramite il metodo jQuery normale.

(function($) 
{ 
    $.fn.myPlugin = function(anotherIdentifier) 
    { 
      // this.click is equivalent to $(identifier).click() 
      this.click(function() 
      { 
       // Thing to do 
      }); 
    }; 
})(jQuery); 

Answer 4

Usa this per accedere all'oggetto che il plugin è stato richiamato su:

(function($){ 
    $.fn.myPlugin=function(update_id){ 
     this.click(function() { $(update_id).html("content_upated"); }); 
    } 
})(jQuery); 

Si noti che l'utilizzo avrebbe bisogno di includere il selettore id in questo esempio, o si avrebbe bisogno di includere nel vostro click funzione:

$("#some_id").myPlugin("#another_id"); 

Answer 5

(function($){ 
    $.fn.myPlugin=function(update_id){ 
     this.click(function(){ $(update_id).html("content_upated"); }); 
    } 
})(jQuery); 

assicurarsi update_id è un selettore valido.