webentwicklung-frage-antwort-db.com.de

Wie führe ich verschiedene Versionen von jQuery auf derselben Seite aus?

Mein Unternehmen hat ein Produkt erworben, das auf der Seite ein ASP.NET-Steuerelement darstellt. Dieses Steuerelement verwendet jQuery 1.2.3 und fügt der Seite ein Skripttag hinzu, um darauf zu verweisen. Die Entwickler des Steuerelements unterstützen die Verwendung des Steuerelements nicht, wenn es in irgendeiner Weise geändert wurde (einschließlich Änderungen, um auf eine andere Version von jQuery zu verweisen).

Ich beginne gerade mit der Entwicklung meiner eigenen Steuerung und möchte die Funktionen und Geschwindigkeitsverbesserungen von jQuery 1.3 nutzen. Beide Steuerelemente müssen auf derselben Seite vorhanden sein.

Wie kann ich zulassen, dass das gekaufte Steuerelement jQuery 1.2.3 und neue benutzerdefinierte Entwicklungen zur Verwendung von jQuery 1.3 verwendet? Was wäre, wenn wir aus Neugier ein zusätzliches Steuerelement verwenden würden, das auf eine andere Version von jQuery verweisen musste?

asp.netjavascriptjquery
68
Alex Angas

Sie können dies erreichen, indem Sie Ihre Version von jQuery im Kein Konfliktmodus ausführen. Der Modus "Kein Konflikt" ist die typische Lösung, um jQuery auf einer Seite mit anderen Frameworks wie prototype zum Laufen zu bringen, und kann auch hier verwendet werden, da er im Wesentlichen jede Version von jQuery, die Sie laden, als Namespaces bezeichnet.

<script src="jQuery1.3.js"></script>
<script>
    jq13 = jQuery.noConflict(true);
</script>

<!-- original author's jquery version -->
<script src="jQuery1.2.3.js"></script>

Diese Änderung bedeutet, dass jedes der jQuery-Elemente, die Sie verwenden möchten, mit jq13 anstelle von $ aufgerufen werden muss, z.

jq13("#id").hide();

Es ist nicht ideal, wenn beide Versionen auf derselben Seite laufen. Wenn Sie jedoch keine Alternative haben, sollten Sie mit der obigen Methode zwei unterschiedliche Versionen gleichzeitig verwenden.

Auch aus Neugier, was wäre, wenn wir eine zusätzliche Steuerung verwenden würden das musste noch eine andere Version von jQuery referenzieren?

Wenn Sie eine andere Version von jQuery hinzufügen mussten, können Sie Folgendes erweitern:

<script src="jQuery1.3.js"></script>
<script>
    jq13 = jQuery.noConflict(true);
</script>
<script src="jQuery1.3.1.js"></script>
<script>
    jq131 = jQuery.noConflict(true);
</script>

<!-- original author's jquery version -->
<script src="jQuery1.2.3.js"></script>

Die Variablen jq13 und jq131 werden jeweils für die von Ihnen benötigten versionsspezifischen Funktionen verwendet. 

Es ist wichtig, dass der vom ursprünglichen Entwickler verwendete jQuery zuletzt geladen wird. Der ursprüngliche Entwickler hat seinen Code wahrscheinlich unter der Annahme geschrieben, dass $() die jQuery-Version verwenden würde. Wenn Sie eine andere Version nach der anderen laden, wird der $ von der zuletzt geladenen Version "ergriffen". Dies bedeutet, dass der Code des ursprünglichen Entwicklers auf der neuesten Bibliotheksversion ausgeführt wird, wodurch die noConflicts etwas überflüssig wird!

99
ConroyP

Wie gesagt, ConroyP können Sie dies mit jQuery.noConflict machen, aber var nicht vergessen, wenn Sie die Variable .

<script src="jQuery1.3.js"></script>
<script>
    var jq13 = jQuery.noConflict(true);
</script>

<!-- original author's jquery version -->
<script src="jQuery1.2.3.js"></script>

Sie können alle $'s mit jq13 verbinden, indem Sie (jq13) nach dem }) der Funktion hinzufügen. so was

(function($) {
 ... 
})(jq13);
24
Tigran Tokmajyan

Es scheint, dass die Reihenfolge keine Rolle spielt ... zum Beispiel: http://Gist.github.com/136686 . Die Konsolenausgabe befindet sich oben und alle Versionen scheinen an den richtigen Stellen zu sein.

2
Aaron Gibralter

machen Sie es falsch zu arbeiten

var jq16 = $.noConflict(false);
1
snicee

In der zweiten Version deklarieren Sie eine Variable als $ .noConflict (true). Und verwenden Sie die deklarierte Variable anstelle von $, die im Jquery-Code verwendet wird. Bitte überprüfen Sie den folgenden Code: Dieser Code wird nach der Deklaration der zweiten Jquery-Version verwendet:

<script type="text/javascript">
var jQuery_1_9_1 = $.noConflict(true); function pageLoad(sender, args) {

        var $ddl = jQuery_1_9_1("select[name$=drpClassCode]");
        var $ddl1 = jQuery_1_9_1("select[name$=drpSubContractors]");
        $ddl.select2();
        $ddl1.select2();

        $ddl.bind("change keyup", function () {
            $ddl.fadeIn("slow");


        });

        $ddl.bind("change keyup", function () {
            $ddl1.fadeIn("slow");


        });
    }
0
Manish Ojha