jQuery einbindung

    Hallo,

    ich entwickele eine Komponte in einem nacktem Basis-Joomla-System Joomla! 3.9.20.
    In meinen Quelcodes verwende ich jQuery mit $ Befehlen.
    Durch das einbinden von jQuery


    $doc = JFactory::getDocument();

    $doc->addScript('http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js');

    $doc->addScriptDeclaration('jQuery.noConflict();');

    funktioniert auch meine Komponente einwandfrei mit jQuery.


    Wenn ich aber die Komponente in das Kundensystem überführe, bekomme ich einen Konflikt:

    BrowserConsole FireFox/FireBug:

    Laden von gemischten aktiven Inhalten "http://ajax.googleapis.com/aja…query/1.7.2/jquery.min.js" wurde blockiert.2 de

    Laden fehlgeschlagen für das <script> mit der Quelle "http://ajax.googleapis.com/aja…query/1.7.2/jquery.min.js".


    und die JQuery-Funktionalität liegt brach.

    Füge ich einfach jQuery auf folgende Weise ein:

    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>

    dann läuft zwar alles, jQuery-Funktionalität - aber es kommt zu einer Warnung/Fehlermeldung in der Browser-Konsole:

    Uncaught TypeError: jQuery(...).owlCarousel is not a function

    <anonymous> https://domainname.de/templates/kunde/js/template.js:112

    jQuery 4

    template.js:112:33

    <anonym> https://domainname.de/templates/kunde/js/template.js:112

    jQuery 4

    u

    fireWith

    ready


    diese Fehlermeldung in der Konsole erhalte ich aber auch nur im Kundensystem, denn in meinem Entwicklungssystem ist alles fehlerfrei.
    Ist die Warnung schlimm? Die Vorgehensweise ist allerdings schon unschön, weil so sollte man ja jquery nicht einbinden?!

    Gibt es noch einen anderen Weg, um jQuery zu erhalten?

    Man könnte ja meinen, das System enthält schon jQuery, aber es gibt bei gibt immer solche Fehler:     $. unknow
    wenn ich garkein jQuery einbinde.


    Zitat von IceEagle

    Gibt es noch einen anderen Weg, um jQuery zu erhalten?

    So ziemlich egal, wo in Joomla-Code, bspw. in der index.php des Templates

    Code
    JHtml::_('jquery.framework');

    lädt dir die nötigen Scripts.

    Zitat von IceEagle

    $doc->addScript('http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js');

    Ist ja klar, wenn du http verwendest, dass du dann einen "gemischte Inhalte" bekommst. Aber so verursachst du eh doppeltes Laden von JQuery, was natürlich üble Performance-Einbuße ist.


    Bei dem, was ich ingesamt rauslese, empfehle ich dir, das Helferlein-Plugin JQueryEasy zu verwenden und so einzustellen, dass JQuery aus dem "Framework" geladen wird, da wir deinen Gesamt-Code nicht kennen. Irgendwo hast einen größeren Fehler drinnen bzgl. Ladereihenfolgen der Skripte.

    Vielen Dank für eure Tipps.

    also hier komme ich leider nicht weiter.

    Wenn ich das hier oben in meinem PHP einbinde:

    Code
    JHtml::_('jquery.framework');

    Dann funktioniert mein JavaScript nicht mehr, selbst wenn ich meine ursprüngliche Einbindung drin lasse.

    Zitat von Re:Later

    Bei dem, was ich ingesamt rauslese, empfehle ich dir, das Helferlein-Plugin JQueryEasy zu verwenden und so einzustellen, dass JQuery aus dem "Framework" geladen wird, da wir deinen Gesamt-Code nicht kennen. Irgendwo hast einen größeren Fehler drinnen bzgl. Ladereihenfolgen der Skripte.

    owlCarousel gibt es ja einige Erweiterungen, die das verwenden. Oder man bindet es selbst ein.


    Die Ladereihenfolge muss in diesem Fall sein:


    1. JQuery (einmalig für die gesamte Seite).

    2. owlCarousel- Datei, die die Grundfunktion definiert

    3. 1 oder mehrere owlCarousel-Init-Script(e), die in den meisten Fällen direkt im HTML-Seitenquelltext eingesetzt ist/sind.


    So verhält es sich mit allen JQuery-abhängigen Skripten.


    Ein Fehler wie deiner oben, führt dazu, dass nachfolgendes JavaScript, egal, ob das nun irgendwie Teil/Ursache des Hauptfehlers ist, nicht mehr ausgeführt wird.


    Heutztage kann es auch Restriktionen, bspw. HTTP-Header-Regeln auf dem Server, die es nicht mehr erlauben, Javascript irgendwo "reinzuhauen".


    Auf https versus http hat dich christine2 ja zusätzlich hingewiesen.


    Ein Mehrfacheinbinden von JQuery führt in den allermeisten Fällen zu gravierenden Fehlern und ist zusätzlich (spätestens) heutzutage absolutes NoGo, da die JQuery-Bibliothek recht groß ist. Wenn ich in deinem falschen Link oben auch noch /kunde/ lese, hoffe ich, dass du das nicht wirklich für einen Kunden machst, der für deine Arbeit bezahlen soll ;)

    Es reicht normalerweise aus, Scripte mit Protokoll-los mit // einzubinden, dann hat man diese Probleme mit SSL oder ohne SSL erst gar nicht.


    Ob das Joomla jQuery zu Owl inkompatibel ist, sieht man nicht.


    Oft werden Scripte nicht nur in der falschen Reihenfolge geladen sondern, was wichtiger ist, unverzögert gestartet. Mit Ajax lässt sich so die Reihenfolge schon mal gar nicht kontrollieren. Wichtig wäre, mit der Ausführung von Owl so lange zu warten, bis das DOM gestartet ist und jQuery auch verfügbar ist.