Isabell Fock: Problem: HTML Dropdown-Menü und JS

Beitrag lesen

SELF-Forum

Problem: HTML Dropdown-Menü und JS

Isabell Fock
– Informationen zu den Bewertungsregeln

Hallo zusammen,

ich habe leider ein kleines Problem mit meinem HTML und Java script Code.

Und zwar hätte ich gerne ein Dropdown-Menü, in dem ich Sprachen auswählen kann. Wenn ich z.B. Englisch auswählen, soll ein Feld aufgehen in dem englischer text inklusuve HTML, CSS und JS Code. Und wenn ich eine andere Sprache wähle soll statt dem Englischen Feld ein anderes auf gehen.

Ich dachte mit dem Code, wie er unten zu sehen ist und dem JS Befehl " document.getElementById("head").innerHTML = "Englischer Text hier"; " würde es gehen. Leider kann ich dann eben nur Text einfügen und keine neuen HTML, CSS oder JS Codes :(

Meine Idee ob es mit einem fieldset gehen könnte? Allerdings weiß ich nicht wie ich mit der ausgewählte Sprache (also den valua oder id??) dann das jeweilige fieldset auswählen kann...weil so wie ich es bisher gemacht habe, ist die ID "Englisch" nur im Java Script zugänglich und nicht mehr im HTML....oder gibt es dafür einen ganz anderen Ansatz, mit dem es funktioniert?

Ich würde mich über eure Hilfe sehr freuen...

Viele Grüße

Hier noch mein Code:

<!DOCTYPE html>
<html>
<body>

<p>Please select your language</p>

<select id="mySelect" onchange="myFunction()">
  <option value="Deutsch">Deutsch
  <option value="English">English
  <option value="Espanol">Espanol
  <option value="Italian">Italian
</select>


<p id="head"></p>

<p id="footer"></p>

<script>
function myFunction() {
    var x = document.getElementById("mySelect").value;

if (x == "Deutsch"){
    document.getElementById("head").innerHTML = "HEAD Hier steht deutsches";

    document.getElementById("footer").innerHTML = "FOOTER Hier steht deutsches";
}

if (x == "English"){
    document.getElementById("head").innerHTML = "HEAD this could be english text";

    document.getElementById("footer").innerHTML = "FOOTER this could be english text";
}

if (x == "Espanol"){
    document.getElementById("head").innerHTML = "HEAD espanol text hier";

    document.getElementById("footer").innerHTML = "FOOTER espanol text hier";
}

if (x == "Italian"){
    document.getElementById("head").innerHTML = "HEAD italian text hier";

    document.getElementById("footer").innerHTML = "FOOTER italian text hier";
}

}
</script>


 <fieldset class="klassenbezeichnung" id="id_fieldset">
    Hier könnte HTML und JS stehen
</fieldset>

</body>
</html>
Beitrag melden
–
Informationen zu den Bewertungsregeln