rudi: Bei OnClick div-element in anderes div-element laden

Beitrag lesen

der Code in deinem Startbeitrag hat ein paar ' zu viel und ein innerHTML zu wenig. Vergleich ihn mal mit dem, was ich in meinen Antworten geschrieben habe.

Gruß, Jürgen

Es Funktioniert ^_^
Vielen Dank, Jürgen!

Nun habe ich zwei Varianten.

Ich denke mal, dass die erste aufgrund des geringeren Codes die bessere ist.

Nochmals vielen Dank. =)

--------------VARIANTE 1--------------

<div id="inhalt">  
Hier der alte Text  
</div>  
  
<div id="neu1" style="visibility:hidden">  
neuer text Nr. 1  
</div>  
  
<div id="neu2" style="visibility:hidden">  
neuer text Nr. 2  
</div>  
  
<a href="#" OnClick="document.getElementById('inhalt').innerHTML = document.getElementById('neu1').innerHTML;">Text wechseln zu 1</a>  
<a href="#" OnClick="document.getElementById('inhalt').innerHTML = document.getElementById('neu2').innerHTML;">Text wechseln zu 2</a>

--------------VARIANTE 2--------------

<script language="javascript">  
	var d = document;  
	var INFO_IDENT = 'displayInformation';  
	function switchCharInfo( id ){  
		var CharInfoContainer = d.getElementsByTagName( 'div' );  
		  
		if( CharInfoContainer ){  
			for( var i = 0; i < CharInfoContainer.length; i++ ){  
				if( CharInfoContainer[i].lang == INFO_IDENT ){  
					if( CharInfoContainer[i].id == "info_page"+id ){  
						CharInfoContainer[i].style.display = 'block';  
					}else{  
						CharInfoContainer[i].style.display = 'none';  
					}  
				}  
			}  
		}  
	}  
</script>
<div style="margin-bottom: -10px;"><h5 style="padding-left: 0px;"><!--Zahlungsmethode--></h5></div>  
<div style="float: left; width: 158px; color: #e0e0e0; padding-bottom: 10px;margin-top:5030px;">  
	<a href="JavaScript:switchCharInfo(1)" onClick="switchCharInfo(1);"/>erste box</a><br />  
    <a href="JavaScript:switchCharInfo(2)" onClick="switchCharInfo(2);"/>zweite box</a><br />  
    <a href="JavaScript:switchCharInfo(3)" onClick="switchCharInfo(3);"/>dritte box</a><br />  
</div>  
<br style="clear: left;" />  
<div style="border:solid red 1px;width:200px;" lang="displayInformation">  
	leere BOX !  
</div>  
<div style="display:none;border:solid red 1px;width:200px;" id="info_page1" lang="displayInformation">  
	ERSTE BOX !  
</div>  
<div style="display:none;border:solid red 1px;width:200px;" id="info_page2" lang="displayInformation">  
	ZWEITE BOX !  
</div>  
<div style="display:none;border:solid red 1px;width:200px;" id="info_page3" lang="displayInformation">  
	DRITTE BOX !  
</div>