2015-07-30 3 views
5

Ho bisogno di aiuto per creare un plugin jQuery per uno dei miei script JS vanilla, this here è l'attuale plugin jQuery, ma il prossimo la versione funziona con più metodi e ho bisogno di affrontarli tutti in qualche modo.Javascript: oggetto [metodo]() non funziona o come creare un plugin jQuery per un semplice codice Javascript

Attualmente stavo lavorando su questo

(function($) { 
    var t; 
    $.fn.KUTE = function(method, start, end, ops) { // method can be Animate(), fromTo(), to(), stop(), start(), chain(), pause(), stop(), etc 
     return this.each(function(){   
      if (method === 'to') {     
       t = new KUTE[method](this, null, end, ops); 
      } else if (method === 'fromTo' || method === 'Animate') { 
       t = new KUTE[method](this, start, end, ops); 
      } 
      if (t !== undefined && typeof t[method] === 'function') { 
       console.log(t) // this shows proper object 
       t[method]() // this doesn't work 
      } 
     }); 
    }; 
})(jQuery);  

Perché t[method]() non funziona e come posso farlo funzionare?

AGGIORNAMENTO: Sto aggiungendo qui alcuni esempi di codice su come le cose aggirano questo codice. Fondamentalmente io costruisco un oggetto tween

var tween = $(div).KUTE('to', { left: tl }, { easing: easing, duration: 1000 }); 

poi ho bisogno di start() esso, stop() e altri metodi.

$(tween).KUTE('start'); // this should basically be it. 

Ora, ho letto su alcune cose come Javascript call() e apply() e mi era un po 'pensando che può essere richiesto al fine di lavorare, ma anche così la t[method].call(t) // where t is "this", non funziona. Spero di aver fatto bene a indicare il mio problema, correggimi se qualcosa non va.

Grazie mille.

+0

Non sono sicuro che sia il problema, ma vi manca un punto e virgola attorno alla riga del problema. Prova a risolverli. – Katana314

+0

@ Katana314 Mentre sono piuttosto anti-ASI, non c'è nulla su quelle righe che dovrebbe causare un errore. –

+6

Cosa intendi per "non funziona?" Che errore ottieni? – ssube

risposta

6

Penso di aver scoperto perché, il mio ultimo commento sopra lo spiega e ho creato una funzione jQuery diversa.

(function($) { 
    $.fn.KUTE = function(method, start, end, ops) { // method can be Animate(), fromTo(), to(), stop(), start(), chain(), pause() 
     var tws = [], i, l = this.length; 

     for (i=0;i<l;i++){ 
      var mt = this[i][method]; 
      if (typeof mt === 'function') { 
       mt.apply(this[i]); 
      }  
      if (method === 'to') { 
       tws.push(new KUTE[method](this[i], start, end)); // here start is end and end is ops 
      } else if (method === 'fromTo' || method === 'Animate') { 
       tws.push(new KUTE[method](this[i], start, end, ops)); 
      }   
     } 
     return tws; 
    }; 
})(jQuery); 

seguente da fare è, che se this.length > 1 fare un bel po 'FOR() al posto del super cattivo e brutto jQuery.each().

Problema risolto, vedere il mio codepen per un esempio.

AGGIORNAMENTO: Ho aggiunto anche il FOR e funziona come previsto. Ho aggiornato la risposta sopra.