Auf Thema antworten 2026

Beitrag

<blockquote data-quote="Coulyo" data-source="post: 2517631" data-attributes="member: 577378">Hi, ich habe ein recht merkwürdiges Problem mit Ajax. Ich beschäftige mich das erste Mal damit, also vielleicht übersehe ich das Offensichtliche. <img src="/styles/default/xenforo/smilies/confused.gif"&nbsp; class="smilie" loading="lazy" alt=":confused:" title="Confused&nbsp; &nbsp; :confused:" data-shortname=":confused:" />Was ich machen möchte:Wenn meine Seite geladen wird, frage ich mit Modernizr ab, ob ein Touchgerät verwendet wird. Wenn nicht, lade ich ein Video in den Container mit der id &quot;header-video&quot;. Erst wenn man dann auf einen Button klickt (.view-video), soll ein zweites Video in einem Overlay (#video-fullscreen) geladen werden.Das Problem:Wie man am Code sehen kann, befinden sich sowohl #video1, als auch #video2 in der gleichen Datei (videos.html). Sie enthält nur den Code für die Videos:[html]&lt;video id=&quot;video1&quot; class=&quot;video-teaser vjs-video video-js vjs-default-skin&quot; autoplay loop muted&gt;&nbsp; &nbsp; &lt;source src=&quot;videos/pageTestTeaser.mp4&quot; type=&quot;video/mp4&quot; /&gt;&lt;/video&gt;&lt;video id=&quot;video2&quot; class=&quot;video-teaser vjs-video video-js vjs-default-skin&quot; controls autoplay&gt;&nbsp; &nbsp; &lt;source src=&quot;videos/pageTestFull.mp4&quot; type=&quot;video/mp4&quot; /&gt;&lt;/video&gt;[/html]&nbsp;#video1 wird wie gewollt geladen, das Dumme ist nur, das #video2 gleich mit geladen wird, ohne dass der Button geklickt wurde. Ich höre dann den Ton des zweiten Videos im Hintergrund, es ist aber nicht sichtbar. Auch wenn ich #video2 in eine andere Datei auslagere, die nur den Code für das Video enthält, wird das Video weiterhin gleichzeitig mit #video1 aus der videos.html geladen.Erst wenn ich #video2 in eine andere Datei packe und aus der videos.html entferne, kann ich beide Video unabhängig voneinander laden.Mein Frage: Ist das das normale Verhalten von Ajax? Oder liegt es an der .load() Methode? Oder stimmt einfach irgendwas mit meinem Code nicht? <img src="/styles/default/xenforo/smilies/uhm.gif"&nbsp; class="smilie" loading="lazy" alt=":(" title="Frown&nbsp; &nbsp; :(" data-shortname=":(" />Der relevante Code:[code=JavaScript]function loadHeaderVid(){&nbsp; &nbsp; var windowHeight = $(window).height();&nbsp;&nbsp; &nbsp; &nbsp; if(!Modernizr.touch){&nbsp; &nbsp; &nbsp; &nbsp; if(!(document.getElementById(&#039;video1&#039;))){&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; $(&#039;#header-video&#039;).load(&#039;videos.html #video1&#039;, function(){&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; //hier steht noch einiges Zeug für die Initialisierung von video.js&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; });&nbsp; &nbsp; &nbsp; &nbsp; }&nbsp; &nbsp; }}function loadFullscreenVid(){&nbsp; &nbsp; var windowHeight = $(window).height();&nbsp;&nbsp; &nbsp; &nbsp; $(&#039;.view-video&#039;).click(function(){&nbsp; &nbsp; &nbsp; &nbsp; //testen, ob video-Element exisiert&nbsp; &nbsp; &nbsp; &nbsp; if(!(document.getElementById(&#039;video2&#039;))){&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; $(&#039;#video-fullscreen&#039;).load(&#039;videos.html #video2&#039;, function(){&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; //hier steht noch einiges Zeug für die Initialisierung von video.js&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; $(&#039;#video-fullscreen&#039;).fadeIn(1000);&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; });&nbsp; &nbsp; &nbsp; &nbsp; }&nbsp; &nbsp; &nbsp; &nbsp; else{&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; $(&#039;#video-fullscreen&#039;).fadeIn(1000);&nbsp; &nbsp; &nbsp; &nbsp; }&nbsp; &nbsp; });}[/code]</blockquote>

[QUOTE="Coulyo, post: 2517631, member: 577378"] Hi, ich habe ein recht merkwürdiges Problem mit Ajax. Ich beschäftige mich das erste Mal damit, also vielleicht übersehe ich das Offensichtliche. :confused: Was ich machen möchte: Wenn meine Seite geladen wird, frage ich mit Modernizr ab, ob ein Touchgerät verwendet wird. Wenn nicht, lade ich ein Video in den Container mit der id "header-video". Erst wenn man dann auf einen Button klickt (.view-video), soll ein zweites Video in einem Overlay (#video-fullscreen) geladen werden. Das Problem: Wie man am Code sehen kann, befinden sich sowohl #video1, als auch #video2 in der gleichen Datei (videos.html). Sie enthält nur den Code für die Videos: [html]<video id="video1" class="video-teaser vjs-video video-js vjs-default-skin" autoplay loop muted> <source src="videos/pageTestTeaser.mp4" type="video/mp4" /> </video> <video id="video2" class="video-teaser vjs-video video-js vjs-default-skin" controls autoplay> <source src="videos/pageTestFull.mp4" type="video/mp4" /> </video>[/html] #video1 wird wie gewollt geladen, das Dumme ist nur, das #video2 gleich mit geladen wird, ohne dass der Button geklickt wurde. Ich höre dann den Ton des zweiten Videos im Hintergrund, es ist aber nicht sichtbar. Auch wenn ich #video2 in eine andere Datei auslagere, die nur den Code für das Video enthält, wird das Video weiterhin gleichzeitig mit #video1 aus der videos.html geladen. Erst wenn ich #video2 in eine andere Datei packe und aus der videos.html entferne, kann ich beide Video unabhängig voneinander laden. Mein Frage: Ist das das normale Verhalten von Ajax? Oder liegt es an der .load() Methode? Oder stimmt einfach irgendwas mit meinem Code nicht? :( Der relevante Code: [code=JavaScript]function loadHeaderVid(){ var windowHeight = $(window).height(); if(!Modernizr.touch){ if(!(document.getElementById('video1'))){ $('#header-video').load('videos.html #video1', function(){ //hier steht noch einiges Zeug für die Initialisierung von video.js }); } } } function loadFullscreenVid(){ var windowHeight = $(window).height(); $('.view-video').click(function(){ //testen, ob video-Element exisiert if(!(document.getElementById('video2'))){ $('#video-fullscreen').load('videos.html #video2', function(){ //hier steht noch einiges Zeug für die Initialisierung von video.js $('#video-fullscreen').fadeIn(1000); }); } else{ $('#video-fullscreen').fadeIn(1000); } }); }[/code] [/QUOTE]

Bilder bitte hier hochladen und danach über das Bild-Icon (Direktlink vorher kopieren) platzieren.

Authentifizierung

Wenn ★ = 12, ◇ = 4 und die Hälfte von ★ zu ◇ addiert wird, was ist das Ergebnis?