Zwei Werte per onclick ändern

F

fredolin

Erfahrenes Mitglied
Hallo Folks,

ich hab da ein klenes Problem. In meinen swapDiv JavaScript möchte ich nun noch die class ändern.
Hier mal mein Text
PHP: 
die Styles Class
h3_inaktiv{
  color: #00FF00;
  font-size: 11px
}


h3_aktiv{
 color: #FF0000;
 font-size: 14px;
}


function swapDiv(basename, nr) {
  var div = document.getElementById(basename+nr);
  var style = document.getElementByCLassName("inaktiv"+nr);
  if (div.style.display == 'none') {
    div.style.display = 'block';
    style.className = 'h3_aktiv';
    alert('div');
  } else {
    div.style.display = 'none';
  }
  return true;
}

aufruf in der seite
<ul class="seitennavi_item">
	<li id="inaktiv1" class="h3_inaktiv"><a href="#" onClick="swapDiv('subnavi','1');">United Transfer Pakete</a>
		<ul id="subnavi1" style="display:none;">
			<li>Innovation</li>
			<li>Evolution</li>
			<li>Revolution</li>
			<li>Basis</li>
			<li>Minishop</li>
			<li>Spezial</li>
		</ul>
	<li class="seitennavi_trenner_rot"></li> 
</ul>

Doch leider klappt es nicht so wie ich esmir gedacht habe. Habe auch etwas gegoogle. Aber leider nichts vergleichbares gefunden.
Kann jemand helfen..

Gruß
Fredolin
 
Hi fredolin,

wie es scheint sind in deinem Beispiel schonmal 3 Fehler ;). Der erste wäre, dass die Methode die alle Elemente einer bestimmten styleClass zurückgibt getElementsByClassName() heisst. Ausserdem bekommst du hier auch eine Liste mit entsprechenden HTML-Elementen. Das zweite was auffällt ist, es scheint kein Element mit dem className "inaktiv"+nr zugeben, sondern nur als id. Und als letztes fehlt mit der Punkt vor den styleClass-Definitionen - aber da bin ich nicht der Experte für :(.
Wenn das alles gefixt ist, könnte das so aussehen.
Code: 
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 3.2 Final//EN">
<html>
<head>
    <style>
        .h3_inaktiv {
            color: #00FF00;
            font-size: 11px
        }


        .h3_aktiv{
            color: #FF0000;
            font-size: 14px;
        }
    </style>
    <script>
        function swapDiv(basename, nr) {
            var div = document.getElementById(basename+nr);
            var style = document.getElementById("inaktiv"+nr);
            if (div.style.display == 'none') {
                div.style.display = 'block';
                style.className = 'h3_aktiv';
            } else {
                div.style.display = 'none';
            }
            return true;
        }
    </script>
</head>
<body>
    <ul class="seitennavi_item">
        <li id="inaktiv1" class="h3_inaktiv">
    	    <a href="#" onClick="swapDiv('subnavi','1');">United Transfer Pakete</a>
            <ul id="subnavi1" style="display:none;">
                <li>Innovation</li>
                <li>Evolution</li>
                <li>Revolution</li>
                <li>Basis</li>
                <li>Minishop</li>
                <li>Spezial</li>
            </ul>
        <li class="seitennavi_trenner_rot"></li>
    </ul>
</body>
</html>
Vielleicht ist es ja das was du erreichen wolltest ;).

Gruß
K.
 
Um antworten zu können musst du eingeloggt sein.

Neue Beiträge

Zurück