nicht angemeldet
hallo an euch,
hab da wieder ein kleines problem.und zwar geht es um das style="display: none;"
ich versuche mittels einer "was-wäre-wenn-abfrage" einige sachen ein- bzw. auszublenden.
das ganze ist eine *.hta-datei.
vorab stelle ich das html-gerüst da bzw. den dazugehörigen script-auszug:
html-gerüst:
<table id="Tabelle1">
<tr height=5>
<td colspan=12></td>
</tr>
<tr height=75>
<td width=10></td>
<td colspan=10 width=1020><h2><center>Stücklistenscript</h2><h5>für SINGLE AISLE & LONG RANGE</h5></center></td>
<td width=10></td>
</tr>
<tr height=5>
<td colspan=12></td>
</tr>
<tr height=30>
<td width=10></td>
<td width=80 align="center">Flugzeugtyp:</td>
<td width=128><label id="FLTLabel" for="FLT"></label>
<select id="FLT" name="FLT">
<option value="--">Bitte wählen:</option>
<option value="SA1">A318</option>
<option value="SA2">A319</option>
<option value="SA3">A320</option>
<option value="SA4">A321</option>
<option value="LR1">A330-200</option>
<option value="LR2">A330-200 Frachter</option>
<option value="LR3">A330-300</option>
<option value="LR4">A340</option>
<option value="LR5">A340-500</option>
<option value="LR6">A340-600</option>
</select></td>
<td width=247 id="Flugzeugtyp"></td>
<td width=55 align="center">Sektion:</td>
<td width=95><label id="SektionLabel" for="Sektion"></label>
<select id="Sektion" name="Sektion" size="1" maxlength="7">
<option value="--">Bitte wählen:</option>
</select></td>
<td width=105 id="Sek"></td>
<td width=55 align="center">Bereich:</td>
<td width=95><label id="SektionBereich1" for="Bereich1"></label>
<select id="Bereich1" name="Bereich1">
<option value="--">Bitte wählen:</option>
</select></td>
<td width=40>
<input type="text" id="Text1" name="Text1" value="" size="1" maxlength="3"></input></td>
<td width=100 id="Fehlerausgabe1" align="center"></td>
<td width=10></td>
</tr>
das hier ist die besagte stelle um die es sich bei meinem problem dreht.
<tr height=30>
<td width=10></td>
<td colspan=5 rowspan=6 id="Prüfung" valign="bottom"></td>
<td width=100></td>
<td width=55></td>
<td width=95><label id="SektionBereich2" for="Bereich2"></label>
<select id="Bereich2" name="Bereich2" style="display: none;">
<option value="--">Bitte wählen:</option>
</select></td>
<td width=40>
<input type="text" id="Text2" name="Text2" value="" size="1" maxlength="3" style="display: none;"></input></td>
<td width=100 id="Fehlerausgabe2"></td>
<td width=10></td>
</tr>
<tr height=30>
<td width=10></td>
<td width=100></td>
<td width=55></td>
<td width=95><label id="SektionBereich3" for="Bereich3"></label>
<select id="Bereich3" name="Bereich3" style="display: none;">
<option value="--">Bitte wählen:</option>
</select></td>
<td width=40>
<input type="text" id="Text3" name="Text3" value="" size="1" maxlength="3" style="display: none;"></input></td>
<td width=100 id="Fehlerausgabe3"></td>
<td width=10></td>
</tr>
und hier wie es auf dem bildschirm aussieht:
ich habe bewusst die rahmen für die einzelnen spalten dringelassen damit man den unterschied besser erkennt.
nun erfolg der dazugehörige script:
function init_Basis()
{
var Selektierung = function()
{
if( document.Auswahl.Bereich1.options[document.Auswahl.Bereich1.selectedIndex].text == "Q" || document.Auswahl.Bereich1.options[document.Auswahl.Bereich1.selectedIndex].text == "T4L" || document.Auswahl.Bereich1.options[document.Auswahl.Bereich1.selectedIndex].text == "T4R" || document.Auswahl.Bereich1.options[document.Auswahl.Bereich1.selectedIndex].text == "T3L" || document.Auswahl.Bereich1.options[document.Auswahl.Bereich1.selectedIndex].text == "T3R" )
{
var Tür = "Tür"
};
if( Tür == "Tür" )
{
document.getElementById( "Bereich2" ).style.display = "inline";
document.getElementById( "Text2" ).style.display = "inline";
document.getElementById( "Bereich3" ).style.display = "none";
document.getElementById( "Text3" ).style.display = "none";
};
if( Tür != "Tür" )
{
document.getElementById( "Bereich2" ).style.display = "none";
document.getElementById( "Text2" ).style.display = "none";
document.getElementById( "Bereich3" ).style.display = "none";
document.getElementById( "Text3" ).style.display = "none";
};
};
document.getElementById( "FLT" ).onclick = Selektierung;
document.getElementById( "Sektion" ).onclick = Selektierung;
document.getElementById( "Bereich1" ).onclick = Selektierung;
document.getElementById( "Bereich2" ).onclick = Selektierung;
document.getElementById( "Bereich3" ).onclick = Selektierung;
return;
};
wenn ich nun also eines der bedingungen erfülle,wie bereich=Q dann soll er die nächste zelle einblenden.siehe unten:
sobald ich aber nun was an der auswahlliste ändere,wie z.b. ein anderen flugzeugtyp oder einen anderen bereich/sektion dann wird zwar die zelle ausgeblendet (das sehe ich daran das der rahmen wegfällt) aber diese <select><option>...</option></select> bleibt vorhanden also sichtbar (wenn ich eine auswahl anklicke (z.b. änderung des flugzeugtypen),wird der zusätzliche bereich (zelle) ausgeblendet,wenn ich dann zusätzlich aber einen bereich auswähle,wird diese <select><option>...</option></select> wieder sichtbar,obwohl rahmen wegfiel):
wo ist nun mein fehler?
muss dazu sagen,auf dem heimischen pc klappt das wunderbar,da kann ich rumklicken wie ich will,da funktioniert es.nur auf dem pc von der arbeit nicht.liegt es vllt daran?oder erkennt ihr einen fehler?
ps:habe bewusst mit bildern gearbeitet um euch zu veranschaulichen was genau ich meine.hoffe es verdeutlicht mein problem.
lg romero