Darstellungsproblem mit style="display: none;"
Romero
- javascript
hallöchen auch.
hab da ein darstellungsproblem mit meinem script.vorab ist zusagen das es eine *.hta-datei ist.
nun erstmal die auszüge aus dem script:
javascript:
//----------------------------------------------------------
//LinkedSelection wird definiert und entsprechend ausgegeben
//----------------------------------------------------------
function ergebnisZeigen( selected )
{
if( selected.length )
{
var sel = '';
var val = '';
var txt = '';
for( var i = 0; i < selected.length; i++ )
{
sel += ( i>0 ? ' → ' : '') + selected[i].id;
val += ( i>0 ? ' → ' : '') + selected[i].value;
txt += ( i>0 ? ' → ' : '') + selected[i].text;
}
}
document.getElementById( "STL_Meldungen_Überschreiben" ).style.display = "none";
document.getElementById( "STL_Meldungen_Alt_Text" ).style.display = "none";
document.getElementById( "STL_Zusatz_Meldungen" ).style.display = "none";
document.getElementById( "STL_Meldungen_Fehlerausgabe" ).style.display = "none";
document.getElementById( "Prüfung" ).innerHTML = "";
document.getElementById( "Fehler_Meldung" ).innerHTML = "";
document.getElementById( "STL_Meldungen_Fehler" ).innerHTML = "";
//document.getElementById( "msgs" ).innerHTML = "";
document.Auswahl.Start.disabled = true;
document.getElementById( "STL_Meldungen_Alt_Text" ).disabled = true;
document.getElementById( "Überschreiben_Alt_Text" ).disabled = true;
document.getElementById( "Alt_Text" ).disabled = true;
document.Auswahl.Text1.value = "";
document.Auswahl.Bereich2.style.display = "none";
document.Auswahl.Text2.style.display = "none";
document.Auswahl.Bereich3.style.display = "none";
document.Auswahl.Text3.style.display = "none";
};
//-----------------------------------------------------------
//Voreinstellung der Folien-Stückliste durch die Selektierung
//-----------------------------------------------------------
function Selektierung()
{
if( document.Auswahl.Bereich1.options[document.Auswahl.Bereich1.selectedIndex].text != "D" && document.Auswahl.Bereich1.options[document.Auswahl.Bereich1.selectedIndex].text != "E" && document.Auswahl.Bereich1.options[document.Auswahl.Bereich1.selectedIndex].text != "DD" && document.Auswahl.Bereich1.options[document.Auswahl.Bereich1.selectedIndex].text != "EE" && document.Auswahl.Bereich1.options[document.Auswahl.Bereich1.selectedIndex].text != "Bitte wählen:" )
{
document.Auswahl.STL_Folie[0].checked = true;
} else if( document.Auswahl.Bereich1.options[document.Auswahl.Bereich1.selectedIndex].text == "D" || document.Auswahl.Bereich1.options[document.Auswahl.Bereich1.selectedIndex].text == "E" || document.Auswahl.Bereich1.options[document.Auswahl.Bereich1.selectedIndex].text == "DD" || document.Auswahl.Bereich1.options[document.Auswahl.Bereich1.selectedIndex].text == "EE" )
{
document.Auswahl.STL_Folie[1].checked = true;
} else if( document.Auswahl.Bereich1.options[document.Auswahl.Bereich1.selectedIndex].text == 0 )
{
document.Auswahl.STL_Folie[0].checked = false;
document.Auswahl.STL_Folie[1].checked = false;
document.Auswahl.STL_Folie[2].checked = false;
};
//-------------------------------------------------
//Auswahlliste der Türen (Single Aisle - T4L-T4R-Q)
//-------------------------------------------------
if( document.Auswahl.Sektion.options[document.Auswahl.Sektion.selectedIndex].text == "10" )
{
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" )
{
document.Auswahl.Bereich2.style.display = "inline";
document.Auswahl.Text2.style.display = "inline";
} else {
document.Auswahl.Bereich2.style.display = "none";
document.Auswahl.Text2.style.display = "none";
document.Auswahl.Bereich3.style.display = "none";
document.Auswahl.Text3.style.display = "none";
};
if( document.Auswahl.Bereich2.options[document.Auswahl.Bereich2.selectedIndex].text == "Q" || document.Auswahl.Bereich2.options[document.Auswahl.Bereich2.selectedIndex].text == "T4L" || document.Auswahl.Bereich2.options[document.Auswahl.Bereich2.selectedIndex].text == "T4R" )
{
document.Auswahl.Bereich3.style.display = "inline";
document.Auswahl.Text3.style.display = "inline";
} else {
document.Auswahl.Bereich3.style.display = "none";
document.Auswahl.Text3.style.display = "none";
};
};
};
html:
<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" onClick="Selektierung()">
<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" onClick="Selektierung()">
<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" onClick="Selektierung()">
<option value="--">Bitte wählen:</option>
</select></td>
<td width=40>
<input type="text" name="Text1" value="" size="1" maxlength="3"></input></td>
<td width=100 id="Fehlerausgabe1" align="center"></td>
<td width=10></td>
</tr>
<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" onClick="Selektierung()" 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" onClick="Selektierung()" 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>
als erstes sind die beiden id-bereich id="bereich2" u. id="bereich3" ausgeblendet.sollen aber wenn,siehe oben,diverse bedingungen erfüllt sind,ein- bzw. ausgeblendet werden.d.h. also wenn in der ersten selektion ein bestimmtest flugzeug gewählt wurde,dann die entsprechende sektion und ein passender bereich,dann werden die 2 letzten selektionen eingeblendet.wenn diese anforderungen nicht zutreffen,bleiben sie ausgeblendet. das funktioniert soweit ganz gut.nun aber mein problem: wenn ich also diese auswahl so treffe,das die bedingung wie oben zusehen erfüllt ist,wird es ja eingeblendet.wenn ich aber dann eine andere auswahl treffen möchte,und z.b. den flugzeugtyp ändere,verschwinden auch beide auswahlfelder,ändere ich dann aber wieder die sektion,werden diese beiden wieder eingeblendet... oder wenn ich ein neuen flugzeugtyp wähle,merke das es falsch ist,passiert das gleiche...
woran liegt es also?wie gesagt,so lange die bedingungen nicht erfüllt sind sollen diese ausgeblendet sein bzw werden...
hier unten 3 bilder.die ersten beiden sind wie sie normal auszusehen haben.das 3. ist das problem was ich hab.
bild 1
bild 2
bild 3
Hi,
wenn ich aber dann eine andere auswahl treffen möchte,und z.b. den flugzeugtyp ändere,verschwinden auch beide auswahlfelder,ändere ich dann aber wieder die sektion,werden diese beiden wieder eingeblendet... oder wenn ich ein neuen flugzeugtyp wähle,merke das es falsch ist,passiert das gleiche...
woran liegt es also?
Daran, dass du die Bedingungen nicht so formuliert hast, dass sie unter diesen Bedingungen das von dir gewünschte Ergebnis bringen ...?
MfG ChrisB
Daran, dass du die Bedingungen nicht so formuliert hast, dass sie unter diesen Bedingungen das von dir gewünschte Ergebnis bringen ...?
MfG ChrisB
du hast es ja oben durchgelesen... wie sollte ich sie denn ändern?
Hi,
Daran, dass du die Bedingungen nicht so formuliert hast, dass sie unter diesen Bedingungen das von dir gewünschte Ergebnis bringen ...?
du hast es ja oben durchgelesen...
Nein, nur überflogen - mehr mache ich bei hingeworfenem, unkommentiertem Code doch nicht.
wie sollte ich sie denn ändern?
*Überlege* dir, unter welchen Bedingungen du wann was wo ausblenden willst, und wann wo nicht.
Formuliere anschließend eine Anwendungslogik, die auch genau das abbildet, und nicht irgend etwas anderes.
MfG ChrisB
*Überlege* dir, unter welchen Bedingungen du wann was wo ausblenden willst, und wann wo nicht.
Formuliere anschließend eine Anwendungslogik, die auch genau das abbildet, und nicht irgend etwas anderes.
MfG ChrisB
aber das mache ich doch hiermit oder?
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" )
{
document.Auswahl.Bereich2.style.display = "inline";
document.Auswahl.Text2.style.display = "inline";
} else {
document.Auswahl.Bereich2.style.display = "none";
document.Auswahl.Text2.style.display = "none";
document.Auswahl.Bereich3.style.display = "none";
document.Auswahl.Text3.style.display = "none";
};
wenn bei der auswahl kein "Q";"T4L";"T4L";... vorhanden ist soll er dann die entsprechende auswahlliste ja ausblenden... am anfang ist sie ja ausgeblendet und soll es ja auch bleiben,solange wie gesagt eines der sachen ausgewählt wurde... wenn dann was anderes ausgewählt wird,soll der alte zustand hergestellt werden,sprich wieder ausgeblendet werden.
das komische ist ja,zu hause auf dem heimpc funktioniert es,nur auf meiner arbeit nicht?
und dann ist es so... wenn ich über css für td einen rahmen setze,dann wird diese rahmen dann ausgeblendet... nur diese select-felder nich.den textfeld neben den selectfelder sind ja ausgeblendet.das ist ja das was mich wundert...