Herbert1204: onmouseout schließt beim Berühren

SELF-Forum

onmouseout schließt beim Berühren

Herbert1204
– Informationen zu den Bewertungsregeln

Hallo Allerseits

Ich habe unten ein Script eingefügt.
In diesem Script wird durch Anklicken eines Buttons eine Tabelle angezeigt.
Mit dem Ereignis onmouseout soll die Tabelle unsichtbar werden. Aber leider wird die Tabelle bereits beim Berühren unsichtbar (wie bei onmouseover).
Wo dran liegt das?

Des weiteren befindet sich in der Tabelle ein Submit.
Mit Klick auf den Submit überprüft das System, ob in der Tabelle Eintragungen vorgenommen wurden. Wenn nicht, erscheint eine Fehlermeldung. Ansonsten werden die Daten per E-Mail versannt.

Jetzt meine Bitte:
Kann mir jemand das Script folgendermaßen umschreiben:
Wenn der Submit angeklickt wird und keine Fehlermeldung erscheint, soll die Tabelle unsichtbar werden.

Im Voraus schon einmal Vielen Dank

<SCRIPT LANGUAGE="JavaScript">

function validate_form() {

validity = true;

if ((check_checkbox(document.form.Rubrik[00]) == false) && (check_checkbox(document.form.Rubrik[01]) == false) && (check_checkbox(document.form.Rubrik[02]) == false) && (check_checkbox(document.form.Rubrik[03]) == false) && (check_checkbox(document.form.Rubrik[04]) == false) && (check_checkbox(document.form.Rubrik[05]) == false) && (check_checkbox(document.form.Rubrik[06]) == false) && (check_checkbox(document.form.Rubrik[07]) == false) && (check_checkbox(document.form.Rubrik[08]) == false) && (check_checkbox(document.form.Rubrik[09]) == false)

){ /* Funktion Namen (Abfrage) */
validity = false;
show('Layer'); /* zeige Fehler */
}
if (validity);
return validity; /* alle Angaben waren korrekt */
}
function check_checkbox(r, v) {
return (r.checked); /* gibt false zurück wenn nicht übergebener Wert */
}
if (((navigator.appName == "Netscape") && (parseInt(navigator.appVersion.substring(0,1)) >=3))
|| ((navigator.appName == "Microsoft Internet Explorer") && (parseInt(navigator.appVersion.substring(0,1)) >=4)))

{var version=true}

if (document.layers){ /* Browserabfrage: Layer-Object bekannt? */
ns = 1; ie = 0;
}else{
ns = 0; ie = 1;
}
function show(name) {if (ns){ /* Funktion Schicht anzeigen */
document.layers['' + name].visibility = "show";
}else{
document.all['' + name].style.visibility = "visible";
}
}
function hide(name) { /* Funktion Schicht verstecken */
if (ns){
document.layers['' + name].visibility = "hide";
}else{
document.all['' + name].style.visibility = "hidden";
}
}
</SCRIPT>

<script>
function showIt(t) {
v = t.id;
if(v == 'start') {
document.getElementById('opt_start').style.display = 'block';
} else {
document.getElementById('opt_start').style.display = 'none';
}
}
</script>

<form name="form" method="post" action="mailto:henze-herbert@t-online.de?SUBJECT=Betreff für die Mail" enctype="text/plain" onSubmit="return validate_form(this.form)">

<input type="button" name="tage" id="start" onClick="showIt(this)" value="ansehen">

<table width="350" onmouseout="showIt(this)" class="unteroption" id="opt_start" style="display:none" bgcolor="#FFFFCC">
<tr>
<td align="left" valign="top">

<input type="checkbox" name="Rubrik" value="Rubrikbestimmung/Freizeit"> <font face="Arial"><span style="font-size:10pt;"><b><u>Freizeit &amp; Ausfl&uuml;ge</u></b></span></font><br>
<input type="checkbox" name="Rubrik" value="Rubrikbestimmung/Freizeit/Ausflug"> <font face="Arial"><span style="font-size:10pt;">Ausflug</span></font><br>
<input type="checkbox" name="Rubrik" value="Rubrikbestimmung/Freizeit/Brauchtum"> <font face="Arial"><span style="font-size:10pt;">Brauchtum</span></font><br>
<input type="checkbox" name="Rubrik" value="Rubrikbestimmung/Freizeit/Casting"> <font face="Arial"><span style="font-size:10pt;">Casting</span></font><br>
<input type="checkbox" name="Rubrik" value="Rubrikbestimmung/Freizeit/Dating"> <font face="Arial"><span style="font-size:10pt;">Dating</span></font><br>
<input type="checkbox" name="Rubrik" value="Rubrikbestimmung/Freizeit/Misswahlen"> <font face="Arial"><span style="font-size:10pt;">Miss-Wahlen</span></font><br>
<input type="checkbox" name="Rubrik" value="Rubrikbestimmung/Freizeit/Stammtisch"> <font face="Arial"><span style="font-size:10pt;">Stammtisch</span></font><br>
<input type="checkbox" name="Rubrik" value="Rubrikbestimmung/Freizeit/Sportveranstaltungen"> <font face="Arial"><span style="font-size:10pt;">Sportveranstaltungen</span></font><br>
<input type="checkbox" name="Rubrik" value="Rubrikbestimmung/Freizeit/Wanderung"> <font face="Arial"><span style="font-size:10pt;">Wanderung</span></font><br>
<input type="checkbox" name="Rubrik" value="Rubrikbestimmung/Freizeit/Sonstige-Veranstaltungen"> <font face="Arial"><span style="font-size:10pt;">Sonstige Veranstaltungen</span></font><br>

</td>
</tr>
<tr>
<td align="left" valign="top">
<div id="Layer" style="visibility:hidden;"><font color="red" face="Arial"><span style="font-size:11pt;"><b>Du hast keine Veranstaltungsart ausgew&auml;hlt!</b></span></font></div>

</td>
</tr>
<tr>
<td align="left" valign="top">
<input type="submit" onclick="hide('Layer')" value="ausgewählte Anzeigen ansehen" style="width:280px; font-weight:bold; font-size:12pt;">

</td>
</tr>
</table>

Beitrag melden
–
Informationen zu den Bewertungsregeln

  1. onmouseout schließt beim Berühren

    Vinzenz Mai
    +3 Informationen zu den Bewertungsregeln

    Hallo,

    In diesem Script wird durch Anklicken eines Buttons eine Tabelle angezeigt.
    Mit dem Ereignis onmouseout soll die Tabelle unsichtbar werden. Aber leider wird die Tabelle bereits beim Berühren unsichtbar (wie bei onmouseover).
    Wo dran liegt das?

    a) weil onmouseout gleich beim Berühren feuert, siehe ChrisB in einem ähnlich gelagerten Fall.

    b) ist onmouseout hier nicht konsistent und nicht intuitiv:
       Du zeigst einen Bereich durch Anklicken eines Buttons an.
       Es ist konsistent und intuitiv, diesen Bereich ebenfalls durch
       Anklicken eines Buttons wieder auszublenden.

    Anmerkungen:

    a) Du könntest den gleichen Button zum Ein- und Ausblenden nutzen, das Stichwort
       dazu heißt "toggle".
    b) Das verwendete Javascript ist grausam und für moderne Browser ungeeignet.
       Es stammt aus der Zeit des ersten Browserkriegs, als IE3 und 4 zusammen mit
       Netscape 3 und 4 über etwa 99,9% der Marktanteile des Browsermarktes
       verfügten. Das Skript ist in etwa aus dem vergangenen Jahrtausend. Bitte
       lass es in dem Grab, aus dem Du es gerissen hast, weiterschlummern.
    c) Dein HTML weist ebenfalls Züge aus, die in der damaligen Zeit durchaus
       üblich waren. Bitte modernisiere es. Das heißt: vereinfache und verschlanke
       es und überlasse die Darstellung CSS. Verzichte auf inline-Formatierung.

    Du wirst es Dir selbst danken, weil Du einfacheren, robusteren HTML-, CSS- und Javascriptcode bekommst.

    Freundliche Grüße

    Vinzenz

    Beitrag melden
    +3
    Informationen zu den Bewertungsregeln