✔ Über DropDown Div visible/invisible?

Status
Nicht offen für weitere Antworten.
M

Master Flexi

Mitglied
Hallo Community,

ich habe ein DropDown Menü in HTML programmiert und nun möchte ich, dass ein DIV sichtbar bzw. unsichbar wird bei manchen Auswahlen. Also mal an meinem Code:

Code: 
function CheckAuswahl() {
var obj = document.getElementById(document.test.will.a);
obj.style.visibility = 'visible';
}
.....
<div id="a" style="visibility:hidden;float:left; background-color:#000000">SICHTBAR</div>
.....
 <form action="sendemail.php" method="POST" onSubmit="return test()" name="test"> 
 <select name="will" size="1" onchange="CheckAuswahl()">
                    <option value="anmeldung">sichtbar.</option>
                    <option value="infos">unsichtbar.</option>
                    <option value="newsletter">unsichtbar.</option>
	    <option value="hinweise">unsichtbar.</option>
 </select>

Nun funktioniert das ganze irgendwie nicht.
Der IE meldet: Objekt nicht gefunden!

Könnt ihr mir irgendwie weiterhelfen. Vielleicht habt ihr ja eine Idee?

Viele Grüße und Dank
Master Flexi
 
Zuletzt bearbeitet:
Hi,

Du musst den Text, der in der gewählten Option gewählt ist (sichtbar/unsichtbar) auswerten und entsprechend
das Feld setzen. Dazu übergibst Du am besten den Text der Funktion als Parameter. Dort wird er mit Hilfe
eines regulären Ausdrucks geprüft und entsprechend die CSS-Eigenschaft gesetzt.
Code: 
<script type="text/javascript">
  <!--
function CheckAuswahl(strText) {
  var objVis = document.getElementById("a");
  objVis.style.visibility = (strText.match(/unsichtbar/i)) ? 'hidden' : 'visible';
}
 //-->
</script>
Code: 
<div id="a" style="visibility: hidden;float:left; background-color:#000000">SICHTBAR</div>

<form action="sendemail.php" method="POST" onSubmit="return test()" name="test">
  <select name="will" size="1" onchange="CheckAuswahl(this[this.selectedIndex].text);">
    <option value="infos">unsichtbar.</option>
    <option value="anmeldung">sichtbar.</option>
    <option value="newsletter">unsichtbar.</option>
    <option value="hinweise">unsichtbar.</option>
  </select>
</form>
Ciao
Quaese
 
Erstmal vielen Dank!

Leider funktioniert der von dir gepostete Code noch nicht richtig. Es passiert seltsamer weise gar nichts :suspekt:

Code: 
function CheckAuswahl(strText) {
  var objVis = document.getElementById("a");
  objVis.style.visibility = (strText.match(/Anmeldung/i)) ? 'hidden' : 'visible';
   objVis.style.visibility = (strText.match(/weitere Informationen/i)) ? 'hidden' : 'visible';
   objVis.style.visibility = (strText.match(/Newsletter bestellen/i)) ? 'hidden' : 'visible';
   objVis.style.visibility = (strText.match(/Hinweise geben/i)) ? 'hidden' : 'visible';
}
Das ist jetzt der gleiche Text, den ich unten hab. Wie stelle ich jetzt ein ob visible oder hidden?


Vielleicht kannst du mir sagen wieso der Code noch nicht funktioniert.

Vielen Dank und Viele Grüße
MF
 
Zuletzt bearbeitet:
Hi,

ich bin zunächst davon ausgegangen, dass der Text der Optionen dazu dient, zu entscheiden, ob das DIV
angezeigt wird oder nicht.
Offensichtlich sollen aber die Werte (values) der Optionen das Kriterium sein. Versuche mal folgendes.
Code: 
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
  "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title></title>
<meta name="author" content="Quaese">
<meta http-equiv="content-type" content="text/html; charset=iso-8859-1">
<script type="text/javascript">
  <!--
function CheckAuswahl(strText) {
  var objVis = document.getElementById("a");
  // Alle values angeben, die nicht sichtbar sein sollen (durch ODER-Zeichen getrennt)
  objVis.style.visibility = (strText.match(/(info|newsletter|hinweise)/i)) ? 'hidden' : 'visible';
}
 //-->
</script>
</head>
<body>
<div id="a" style="visibility: hidden;float:left; background-color:#000000">SICHTBAR</div>

<form action="sendemail.php" method="POST" onSubmit="return test()" name="test">
  <select name="will" size="1" onchange="CheckAuswahl(this[this.selectedIndex].value);">
    <option value="infos">unsichtbar.</option>
    <option value="anmeldung">sichtbar.</option>
    <option value="newsletter">unsichtbar.</option>
    <option value="hinweise">unsichtbar.</option>
  </select>
</form>
</body>
</html>
Die Werte der Optionen, die fürs Verstecken zuständig sein sollen, werden durch ODER-Zeichen getrennt
im regulären Ausdruck aufgeführt.

Ciao
Quaese
 
Vielen Dank erstmal wieder für die Erklärung!

Leider bekomme ich noch den Fehler "Objekt erwartet".

Ich kann mir wirklich nicht vorstellen, wo dort der Fehler liegen soll, der CODE sieht ziemlich sinnvoll aus, hmmm?

Vielleicht hat jemand eine Idee.

Besten Dank und noch eine schönen Feierabend!
MF
 
Hi,

wenn Du das Dokument wie von mir gepostet übernimmst, solltest Du keinen Fehler erhalten.
Zumindest habe ich es im IE 5.01, IE 5.5, IE6, Opera 8.54, Firefox 1.5, Mozilla 1.5.12 und Netscape 7.0
unter Win XP erfolgreich getestet.
Offensichtlich ist etwas an Deinem Dokument nicht in Ordnung. Vielleicht zeigst Du mal, was Du bisher
hast. Dann können wir sicherlich mehr dazu sagen.

Ciao
Quaese
 
Hi,

sieh an, sieh an, da hatte ich doch glatt einen Fehler irgendwie in mein anderes JavaScript reinbekommen und somit hat irgendwie beides gesponnen. Bin jede Zeile nochmal durchgegangen...

Jetzt läuft es :-)
Komisch nur, dass der IE immer den Fehler im neuen Script gezeigt hat :rolleyes:

Egal jetzt funktioniert alles, wie gewollt!

Besten Dank und Viele Grüße
MF
 
Dann nutze bitte zukünftig auch den "Status"-Button des Themas, um es als erledigt zu markieren.
 
Status
Nicht offen für weitere Antworten.

Neue Beiträge

Zurück