✔ TypeError: $(...).minicolors is not a function

[messmar]

Hallo zusammen,

Ich sitze von nem Rätsel seit 2 Stunden und finde keine Lösung, obgleich ich den Verdacht hab, woran es legen könnte.

Ich verwende den folgenden Plugin für Frabauswhal via einen colorPicker. Und ich binde die jQuery 1.11.3.

Dazu habe ich auch im Code den jQuery PopupOverlay Plugin für einen Overlay, wo ich eine Seite via Ajax Call lade. Und genau diese Seite verwendet den ColorPicker Plugin:
http://labs.abeautifulsite.net/jquery-minicolors/

Problem: Das Ganze funkt. einwandfrei auf Chrome, aber auf FireFox und IExplorer nicht. auf FireFox erhalte ich folgenden Fehler:

Error: TypeError: $(...).minicolors is not a function
Source File: http://code.jquery.com/jquery-1.11.3.min.js line 2 > eval
Line: 9

Auf InExplorer folgendes:

Das Objekt unterstützt die Eigenschaft oder Methode "minicolors" nicht
Datei: eval code (10), Zeile: 9, Spalte: 9

DSie 9 wäre dann das hier:

$(this).minicolors({

Der Code mit dem ich den ColorPicker Plugins ausführe (Invoke).

$.each( $('#part-form').find('input[type=text]'), function(){
  var theEl = $(this);

  $(this).minicolors({
  control: 'hue',
  defaultValue: theEl.val(),
  opacity: false,
  position: $(this).attr('data-position') || 'bottom left',
  //position: 'bottom right',
  change: function(hex, opacity) {
  alert('AAAAA');
  if( !hex ) return;
  if( opacity ) hex += ', ' + opacity;
  if( typeof console === 'object' ) {
  console.log(hex);
  }
  }
  });
  });

Ich habe vieles ausprobiert, getestet, gecheckt, Code bzgl. Koflikten optimiert etc. aber der Fehler bleibt vorhanden.

P.S. ich habe die Seite ohne overlay aufgerufen und zwar mit allen Plugins und meinem Code vorm abschliessendem Body Tag, und es funkt. aufm Firefox auch.

Ich habe die Seite in einem new window aufgerufen (auf mit allen Pugins und meinem Code) und es hat auch in allen Browsern funkt.

<a href="javascript:void(0);" onclick="window.open('http://localhost:8080/core/folder/public/subFolder/inc/seite.jsp?part=wert&locale=de', '', 'width=700, height=700');">Test</a>

Hat bitte Jemand ne Idee, Tipp oder hat mal Erfarung damit gemacht?

Vielen Dank und Grüße
Messmar

 

[messmar]

Stop Stop:

das hatte ich bei dem gepostetem CodeSnippt noch nicht versucht... der Conflict hatte es nur/eher da in diesem Code
gegeben..

Das wundert mit, weil ich zwei eigene gebastelte Plugins auch auf die Seite eingebetttet habe, und dabe dafür gesorgt, dass der
Code in nem geschlossenen Closur ist, wie unten...

(function($){
..
})(jQuery);

so soll es werden dann:

(function($){
$.each( $('#part-form').find('input[type=text]'), function(){
  var theEl = $(this);

  $(this).minicolors({
  control: 'hue',
  defaultValue: theEl.val(),
  opacity: false,
  position: $(this).attr('data-position') || 'bottom left',
  //position: 'bottom right',
  change: function(hex, opacity) {
  alert('AAAAA');
  if( !hex ) return;
  if( opacity ) hex += ', ' + opacity;
  if( typeof console === 'object' ) {
  console.log(hex);
  }
  }
  });
  });

});
})(jQuery);

Any way, Danke für das Mitlesen!
Messmar