Wie kann ein jQuery-Plugin gleichzeitig an mehreren Elementen arbeiten?

Question

Ich habe ein Combobox-Plugin erstellt. Um es zu nutzen, müssen nennen

Sie nur

$(elem).combobox(compensateElement); 

EDIT: Problem ist, dass wenn Sie

$('#1').combobox('form'); 
$('#2').combobox('form'); 

das Plugin tun brechen ...

Der Elem ist die Auswahl der zu verwandelte sich in eine Combobox, und das compensateElement ist ein Element, nach dem das Plugin ein div einfügen kann, das die Länge der SuggestivesDiv-20px hoch ist. (Ich habe eine Fußzeile auf meiner Seite, die nicht von absolut positionierten Elementen gedrückt wird ...)

Jetzt ist das Problem, dass dieses Plugin NUR AUF EINEM ELEMENT VERWENDET WERDEN KANN! Wie kann es geändert werden, so dass es an mehreren Elementen gleichzeitig arbeiten kann? Es sind mehr als hundert Zeilen JS-Code, also erwarte ich nicht den "konvertierten" Code!

Ich habe daran gedacht, alle elementspezifischen Variablen in das this.data "Objekt" zu schreiben, aber es fühlte sich überhaupt nicht wie eine gute Lösung an. Nach dem Ausführen einiger RegEx finden & ersetzen Sie es und konfigurieren es für ein paar Stunden, ich habe es überhaupt nicht funktionieren ...

Welche Techniken kann ich verwenden?

Vielen Dank für Ihre Zeit!

Answer 1

Das Problem ist, dass Sie eine literal object haben, dass sein Inhalt jedes Mal haben Sie m.init() rufen ersetzt.

Ich schlage vor, Sie this post betrachten, die gute Ansätze zum Schreiben von JQuery-Plugins erklärt. Wenn Sie sehen, den „Leichten Start“, zum Beispiel:

$.fn[pluginName] = function (options) { 
     return this.each(function() { 
      if (!$.data(this, 'plugin_' + pluginName)) { 
       $.data(this, 'plugin_' + pluginName, 
       new Plugin(this, options)); 
      } 
     }); 
    } 

dies für jedes Element eine neue Instanz des Plug-ins Objekt erstellt, so dass Sie Zustand konsequent beibehalten.

Answer 2

können Sie Ihre Plugin-Methoden für jedes Element mit jQuery jede Funktion aufrufen. Denken Sie daran, dass innerhalb Ihrer Methoden das Schlüsselwort this auf das aktuelle Element verweist und nicht auf das jQuery-Objekt.

$.fn.combobox = function(form) { 
     var $this = this; 

     return $this.each(function() { 
      if (!m.initialized) { 
       m.init.apply(this, [form]); 
       $this.data('initialized', true); 
      } else { 
       m.updateList.apply(this); 
      } 
     }); 
    };