HTML Objekt mit Variable aus JavaScript füllen

Alex1167 · 11. November 2019 um 14:48

Hallo,
zunächst Entschuldigung, dass ich eine so triviale Frage stelle aber ich komm’ nicht weiter:

Ich möchte

mit Klick auf Links in Seite1.html eine Seite2.html aufrufen,
Seite2.html soll automatisch ein Video abspielen
In Abhängigkeit vom angeklickten Link wird eine Variable (Videoziel) übergeben. Dies, damit ich nicht für jedes Video eine eigene Seite anfertigen muss.
Soweit gelöst:

function ExternesFenster(VideoQuelle)
{MeinFenster = window.open(„Seite2.html?“ + VideoQuelle, „Zweitfenster“, „width=750,height=500,left=100,top=100“);
MeinFenster.focus();
}
[Video
aufrufen](javascript:ExternesFenster(‚http://www.youtube.com/v/XXXXXXX‘))

Seite2.html soll nun die Variable annehmen und das Video abspielen.
Variable annehmen habe ich in Java Script so gelöst:

function VariableAnnehmen() {
test=(parent.location.search.substring(1,parent.location.search.length));
}

Nun zur eigentlichen Frage:
Wie bekomme ich diese Variable dann aus dem JS so ausgelesen, dass Sie in meinem HTML Objekt erscheint?

Scheint trivial, aber wie gesagt, ich komme nicht weiter. Weiss jemand Rat?

Vielen Dank

Alex

RakonDark_2d341e · 11. November 2019 um 14:48

wenn du php laufen lassen kannst auf dem server , wäre das der richtige weg , braucht auch kein javascript .

php kann die URL parameter lesen auswerten dir das HTML bauen und ausgeben

rufst du dann einfach anders auf
window.open(„Seite2.php?video=“ + VideoQuelle,

seite2.php

<?php if (isset($_GET['video'])) {
?\><?php }
?\>

KKO_ae7027 · 11. November 2019 um 14:48

hi Alex,

denke mal … window.location.search … kann Dir helfen )

mfg
Klaus

Alex1167 · 11. November 2019 um 14:49

Hallo Klaus,

vielen Dank für die Antwort, aber das Auslesen der übergebenen Variable ist bereits gelöst. Die Frage war, wie bekomme ich jetzt die JS Variable in mein HTML Objekt?
Oder alternativ: Wie kann ich dieses Objekt in JS definieren?

Gruß

Alex

KKO_ae7027 · 11. November 2019 um 14:49

Hallo Alex,

Variable ist bereits gelöst. Die Frage war, wie bekomme ich
jetzt die JS Variable in mein HTML Objekt?

warum lässt Du auf Seite2 nicht window.location.search auslesen.
Dann hast Du die Variable im Script auf Seite2 )

Gruß
Klaus

KKO_ae7027 · 11. November 2019 um 14:50

Hallo Alex,

Wie kann ich dieses Objekt in JS definieren?

im Quelltext der Seite2 hast Du einen Div-Container für das Object.
Dann schreibst Du mit JS das ganze Object in eine Variable, dabei kannst Du prima die übernommene URL einbauen.
Danach weist Du diese Variable dem innerHTML des Div-Containers zu. Fertig!!

Gruß
Klaus

Alex1167 · 11. November 2019 um 14:50

Hallo Klaus,

das hört sich genau nach dem an, was ich suche. Aber meine Newbee Fähigkeiten (vielleicht sollte ich besser schreiben Nicht-Fähigkeiten) reichen nicht aus, um Deinen Anweisungen zu folgen. Kannst Du mir vielleicht noch ein bisschen mehr auf die Sprünge helfen?
Also konkret: Wie bekomme ich das Object in eine JS Variable und wie weise ich eine Variable dem innerHTML des Div-Containers zu?

Danke & Gruß

Alex

KKO_ae7027 · 11. November 2019 um 14:50

Hallo Alex,

na ungefähr so:



var URL=„http://www.video.de?xxxxx“;
var out=’<object type=„application/x-shockwave-flash“ ';
 out+=‚style=„width:200px; height:180px;“ ‚;
 out+=‚data="‘ + URL + ‚" > ‚;
 out+=‘<param name=„movie“ value="‘ + URL + ‚" >‘;
 out+=‘<param name=„wmode“ value=„transparent“></object>‘;
 document.getElementById(‚ID_des_Containers‘).innerHTML = out;

Wobei das wohl mit window.onload ausgeführt werden sollte, damit der container auch vorhanden ist.
Ebenso sollte man auf embed verzichten.

Gruß
Klaus

Alex1167 · 11. November 2019 um 14:51

LÖSUNG!!!
Hallo lieber lieber Klaus!

Danke für die Lösung. Es funzt!

Weiss zwar nicht, ob ich das jetzt elegant gelöst habe (vermute die Dopplung in JS und HTML ist falsch), aber hier zur allgemeinen Information der gesamte Code:

TestVideo
function VideoLaden()
{

var URL=„http://www.youtube.com/v/u1zgFlCw8Aw“;
var out=’<object type=„application/x-shockwave-flash“ ';
out+=‚style=„height:344px; width:425px;“ ‚;
out+=‚data="‘ + URL + ‚" > ‚;
out+=‘<param name=„movie“ value="‘ + URL + ‚" >‘;
out+=‘<param name=„wmode“ value=„transparent“></object>‘;
document.getElementById(‚VideoObjekt‘).innerHTML = out;
}

Grüße

Alex

KKO_ae7027 · 11. November 2019 um 14:51

Hallo Alex,

warum erst ein Object in den Body schreiben und dann ändern?




window.onload=function(){
var URL=‚http://www.youtube.com/v/u1zgFlCw8Aw‘;
var out=’<object type=„application/x-shockwave-flash“ ‚;
 out+=‚style=„width:425px; height:344px;“ ‚;
 out+=‚data="‘ + URL + ‚">‘;
 out+=‘<param name=„movie“ value="‘ + URL + ‚" >‘;
 out+=‘<param name=„wmode“ value=„transparent“></object>’;
 document.getElementById(‚video‘).innerHTML = out;
}
 Video wird geladen …

Hier heißt der Div-Container „video“.
Onload im body-tag ist auch nicht so gebräuchlich )

Gruß
Klaus

Alex1167 · 11. November 2019 um 14:52

Vollständige und verbesserte LÖSUNG!!!
Hallo Klaus,

das ist natürlich die viel elegantere (und wohl richtige Lösung).

Hier noch mal (für andere Suchende) alles vollständig:
Damit nicht für jedes Video eine statische Seite eingerichtet werden muss, sondern nur eine „VideoSeite.html“ existiert, die dann mit dem jeweiligen Link auf YouTube gefüttert wird, funktioniert folgende Lösung:

Link in aufrufender Seite:
[Video
aufrufen](javascript:ExternesFenster(‚http://www.youtube.com/v/aIV2J_6_vqg‘))

ruft über die Funktion:

function ExternesFenster(VideoQuelle)
{MeinFenster = window.open(„TestVideo.html?“ + VideoQuelle, „Zweitfenster“, „width=750,height=500,left=100,top=100“);
MeinFenster.focus();
}

die Seite TestVideo.html auf, dieses zieht sich dann beim Laden den Link auf Youtube raus und lädt das Video. Diese enthält folgenden Code:

TestVideo
window.onload=function(){
var URL =(parent.location.search.substring(1,parent.location.search.length));
var out=’<object type=„application/x-shockwave-flash“ ‚;
out+=‚style=„width:425px; height:344px;“ ‚;
out+=‚data="‘ + URL + ‚">‘;
out+=‘<param name=„movie“ value="‘ + URL + ‚" >‘;
out+=‘<param name=„wmode“ value=„transparent“></object>’;
document.getElementById(‚video‘).innerHTML = out;
}
Video wird geladen …

KKO_ae7027 · 11. November 2019 um 14:53

Hallo Alex,

komisch das es funktioniert, denn für das neue Fenster ist das nicht:
parent.location.search.substring(1,parent.location.search.length));

sondern

window.location.search…

Gruß
Klaus

KKO_ae7027 · 11. November 2019 um 14:58

Hallo Alex,
um es noch kürzer zu machen, direkt ins neue Fenster schreiben:


Test
function ExternesFenster(URL){
var html="<html><head></head><body>";
var out=’<div><object type=„application/x-shockwave-flash“ ‚;
 out+=‚style=„width:425px; height:344px;“ ‚;
 out+=‚data="‘ + URL + ‚">‘;
 out+=‘<param name=„movie“ value="‘ + URL + ‚" >‘;
 out+=‘<param name=„wmode“ value=„transparent“></object></div>’;
var MeinFenster = window.open("", „Zweitfenster“, „width=750,height=500,left=100,top=100“);
with(MeinFenster.document){open();write(html);write(out);}
}
Video
aufrufen

mfg
Klaus