Via Select/Options und style.display Container ein-/ausblenden

[Czerny]

Ich verstehe deinen Code zwar nicht, bzw. wie und warum du ihn so zusammensetzt, aber egal.

Ja, ich hab da einen Denkfehler drin gehabt... ;)

Bin irgendwie auf die Idee gekommen nur die Variable zu verändern, was natürlich nichts am DOM bewirkt.

Mit einem ähnlichen Script, wie dem von dir, habe ich es auch schon versucht. Mein Problem ist allerdings, dass ich mit dem wechseln zwischen den Einträgen "Deutsch" und "English" im Dropdown nicht nur eine ID ausblenden und eine andere ID einblenden möchte, sondern jeweils mehrere Elemente auf der gesamten Seite verteilt.

Ich habe meine Vorstellung mal im Quelltext mit Kommentaren dargestellt:

<script type="text/javascript">  
	<!--  
  
		/*  
  
			Ja ich weiß, das Dollarzeichen verträgt sich nicht  
			mit Frameworks wie MooTools oder jQuery...  
  
			Diese Funktion holt alle Elemente über die ID.  
				Beispiel: $('myID'); // Spricht id="myID" an.  
  
			Wenn "var localization" auf "= 'de'" geändert wird,  
			ist nur der Inhalt auf Deutsch sichtbar.  
  
			Dieses Umwechseln im DOM, würde ich gern über ein  
			Dropdown mit 2 Optionen (English & Deutsch) ermöglichen.  
  
		*/  
  
		function $(e) {  
			return (document.getElementById(e).style.display = 'block');  
		}  
  
		var localization = 'en';  
  
	//-->  
</script>  
  
<!-- ### Wechselnder Inhalt 1 ### -->  
	<!-- English -->  
	<div id="first_en" style="display:none">  
		English content 1.  
	</div>  
	<!-- German -->  
	<div id="first_de" style="display:none">  
		Deutscher Inhalt 1.  
	</div>  
<hr />  
  
<!-- ### Wechselnder Inhalt 2 ### -->  
	<!-- English -->  
	<div id="second_en" style="display:none">  
		English content 2.  
	</div>  
	<!-- German -->  
	<div id="second_de" style="display:none">  
		Deutscher Inhalt 2.  
	</div>  
<hr />  
  
<!-- ### Wechselnder Inhalt 3 ### -->  
	<!-- English -->  
	<div id="third_en" style="display:none">  
		English content 3.  
	</div>  
	<!-- German -->  
	<div id="third_de" style="display:none">  
		Deutscher Inhalt 3.  
	</div>  
<hr />  
  
<!-- ### Einlesen der Inhalte ### -->  
	<script type="text/javascript">  
		<!--  
  
			/*  
  
				Die Variable localization bestimmt, ob das Element mit  
				"de" oder "en" auf "display: block;" umgestellt wird.  
				Momentan wird nur "first_en", "second_en" usw. angezeigt,  
				weil oben "var localization = 'en';" vorgegeben ist.  
				  
				Diese Vorgabe, ob nur die Elemente mit der Endung "en" oder  
				nur die Elemente mit der Endung "de" auf "display: block;"  
				gestellt werden, würde ich gern über "<select><option>..."  
				beeinflussen, sodass wenn man "English" auswählt, nur die  
				Elemente mit der Endung "en" angezeigt werden und umgekehrt,  
				wenn man "Deutsch" auswählt, nur die Elemente mit der Endung  
				"de" sichtbar sind.  
				  
				Wenn ich allerdings nur die Variable "localization" über eine  
				onChange-Funktion überschreibe, verändert sich nichts im DOM.  
  
			*/  
  
			$('first_' + localization);  
			$('second_' + localization);  
			$('third_' + localization);  
  
		//-->  
	</script>  
  
<!-- ### Dropdown zum Umschalten ### -->  
  
<select name="language" onchange="choose(this)">  
	<option selected>English</option>  
	<option>Deutsch</option>  
</select>