2 Jquery versionen

Roflmao

Mitglied
Guten Abend.
Ich habe es durch die super Hilfe dieses Forums geschafft sowohl den datepicker in meine Website einzubauen.
Jetzt wollte ich beide JQuery scripte auf einer Seite kombinieren, aber leider scheinen Sie sich gegenseitig zu überschreiben. Ich habe 2 Beispiele mit den einzelnden funktionierenden Demos angehängt, wäre jemand so nett und erklärt mir wie ich beide zusammen auf einer Seite benutzen kann.

Danke
 

Anhänge

  • Timepicker and Overlay Demo.zip
    144,4 KB · Aufrufe: 23
Ich habe mir dein zip nicht heruntergeladen. Aber hier ein Beispiel

HTML:
<!DOCTYPE html>
<html>
	<meta http-equiv="content-type" content="text/html; charset=UTF-8" />

	<title>Zwei jQuery Versionen</title>

	<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6/jquery.min.js"></script>
	<script type="text/javascript">
	$(function($) {
		alert($.fn.jquery);
	});
	</script>

	<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
	<script type="text/javascript">
	$(function($) {
		alert($.fn.jquery);
	});
	</script>
</html>

Jetzt hast du zwei document-ready Funktionen, in denen das Dollar Zeichen jeweils für eine anderen jQuery Version steht.
 
Vielen dank, aber meine Funktionen werden nicht mit der Dokument-ready Funktion aufgerufen, sondern nur nach einem click auf einen span oder ein input field. Ich nehmen an, dass dies mein Problem darstellt.
 
Wenn du das span klickst, fürhst du jQuery 1.6 Code aus, wenn du auf das input klickst, dann 1.7

HTML:
<!DOCTYPE html>
<html>
	<meta http-equiv="content-type" content="text/html; charset=UTF-8" />

	<title>Zwei jQuery Versionen</title>

	<span>Span</span>
	<input type="button" value="Input" />

	<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6/jquery.min.js"></script>
	<script type="text/javascript">
	$(function($) {
		$('span').click(function() {
			alert($.fn.jquery);
		});
	});
	</script>

	<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
	<script type="text/javascript">
	$(function($) {
		$('input').click(function() {
			alert($.fn.jquery);
		});
	});
	</script>
</html>

Deine zip Datei gibt nicht viel Auskunft darüber, wie dein Code aussieht. Das sind doch nur Beispiele der beiden Plugins.
 
Wenn ich das mache, was ich in #2 vorgeschlagen habe, funktioniert das bei mir.

Javascript:
//Vorher
$(function() {
	$("#timepicker").timepicker();
});

//Nachher
$(function($) {
	$("#timepicker").timepicker();
});


Edit: Viel besser noch:

Wirf die Zeile komplett raus:
HTML:
<script src="jquery-1.6.2.min.js" type="text/javascript"></script>

und verschiebe stattdessen diese an seine Stelle

HTML:
<script type='text/javascript' src='http://cdn.jquerytools.org/1.2.6/full/jquery.tools.min.js'></script>
 
Zuletzt bearbeitet:
Ich habe im Hinterkopf, dass die (Script-)Dateien nicht sequentiell geladen werden, so dass ich spontan annehmen würde, dass die Reihenfolge nicht verbindlich korrekt ist sondern eher zufällig, und es so auch sein könnte, dass nur eine Version letztlich zum Einsatz kommt.
 
Ich habe im Hinterkopf, dass die (Script-)Dateien nicht sequentiell geladen werden, so dass ich spontan annehmen würde, dass die Reihenfolge nicht verbindlich korrekt ist sondern eher zufällig, und es so auch sein könnte, dass nur eine Version letztlich zum Einsatz kommt.

Das ist falsch. Die Skripte werden alle in exakt der Reihenfolge heruntergeladen und nacheinander ausgeführt. Da liegt auch die Gefahr bei externen Skripten. Wenn ein Skript erst nach 30 Sekunden geladen werden kann, wird auch die Seite erst dann geladen. Sie bleibt so lange weiß, bis alles fertig ist!

Wäre es so, wie du denkst, dann wäre das "async" Attribut (https://developer.mozilla.org/En/HTML/Element/Script#Attributes) sinnlos.
 
Zurück