• Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

<div> Bei Escape verschwinden lassen

Status
Für weitere Antworten geschlossen.

JensB

Neues Mitglied
Hallo,

ich habe leider mal wieder ein Problem, und zwar bastle ich mir ja gerade eine Suchfunktion für meine HP, und das klappt auch ganz gut (mit DOM-Befehlen).

Die Ergebnisse werden in einer absolut positionierten <div id="Blubb"> angezeigt. Jetzt möchte ich, dass diese <div id="Blubb"> bei Drücken von Escape geschlossen wird. Versucht habe ich:

Code:
<div id="Blubb" onkeypress="if (event.keyCode == 27) closeDiv();">..</div>
closeDiv() schließt wie zu erwarten die Div, und diese Methode funktioniert nachweislich, wenn ich sie mit nem onclick ausführe klappt alles. Trotzdem bleibt die <div> visible.

Einen Fehler zeigt mir die FF-Fehlerkonsole nicht an, und die Notation scheint zu funktionieren, im Suchfeld verwende ich zum Beispiel:
Code:
<input id="suche" type="text" onkeypress="if(event.keyCode==13) initSearch('suche');" name="Suchfeld">
Dann sucht er auch beim Drücken von Enter automatisch und man muss nicht erst auf den "Suchen"-Button klicken.

Kann mir jemand helfen?

Vielen Dank,
Jens
 
Firefox und IE behandeln Events verschiedenen.
Der Firefox und auch andere Browser wie Opera usw kennen das window.event Objekt nicht. Sie geben der Funktion einen Parameter mit in denen sich das Event Objekt befindet.
Kannst dir also einen Wrapper schreiben

Nehmen wir mal an du lässt dein closeDiv einfach direkt aufrufen. Dann fragst du da drinnen ab:
Code:
function closeDiv(e) {
  var e = (window.event) ? window.event : e;
  if(e.keyCode == 27) {
    // Was immer du amchen wolltest
  }
}
 
Hallo Gilles,

danke für den Tip! Aber diese Syntax mit dem Fragezeichen kenn ich gar nicht, was bedeutet die genau?

//edit: Und bei mir kommt dann ein Fehler, wenn ich eine Taste drücke: e is undefined

Mein Code:
Code:
<body onkeypress="check(e);">
und
Code:
function check (e) {

    var e = (window.event) ? window.event : e;
    if (e.keyCode == 27) {
        closeResults();
    }

}

Gruß
Jens
 
Code:
<body onkeypress="check(event || window.event);">

Code:
function check (e) {
    if (e.keyCode == 27) {
        closeResults();
    }
}
 
Perfekt, es läuft!

Aber kann mich jemand noch kurz auf diese "var e = (window.event) ? window.event : e;"-Syntax stoßen, vllt mit einem Link, einer kurzen Erklärung oder einem Stichtwort?

Und auch die "<body onkeypress="check(event || window.event);">"-Syntax hab ich noch nie gesehen.. Selbiges wie oben :)
 
Ich erklär es auch nochmal auf Deutsch.

Variable = (Wenn Bedingung) ? Dann Setze mich : Ansonsten mich;

Das heisst wenn die Bedingung erfüllt ist, hat die variable den Wert nach dem ?. Wenn nicht nimmt er den Wert nach dem :
Hoffe das ist klar :)
 
Code:
document.onkeypress=function(key)
{
	key = !key ? event:key;
	code = key.keyCode ? key.keyCode:key.which;
	if(code==27)
		remove();
}
 
Hallo,

danke für die Hinweise. Läuft jetzt problemlos. Aber wo lerne ich sowas? selfHTML ist da teilweise nicht so hilfreich finde ich.. Gibt es da was Aktuelleres?

Gruß
Jens
 
Das stimmt. Aber das ist nicht in allen Browsern gleich.

Bei DOM-Events-kompatiblen Browsern ist das Event-Objekt im Kontext vorhanden; im IE nicht. Da wird einen Kontext höher geguckt, ob die Eigenschaft "event" gefunden werden kann. Und dieser höhere Kontext ist "window", weshalb dort window.event gefunden wird. Das zu Erklärung.

Deshalb reicht, wie struppi richtig sagte, folgendes:
HTML:
<body onkeypress="check(event);">
Man könnte jetzt noch streiten, welche Variante schneller ist.
 
[...]Deshalb reicht, wie struppi richtig sagte, folgendes:
HTML:
<body onkeypress="check(event);">
Man könnte jetzt noch streiten, welche Variante schneller ist.
Ich habe jetzt als Code:
Code:
[FONT=monospace]<body onkeypress="check(event);">
<!-- Jetzt der Javascript-Teil -->

[/FONT]function check (e) {

    // Escape: Suche schließen, klappt
    if (e.keyCode == 27) {
        closeResults();
    }
    
    // F2: Suche anzeigen, klappt nicht
    if (e.keyCode == 113) {
        showSearchForm();
    }

}
Klappt gut im Opera und FF, aber der IE8 realisiert das Drücken von F2 nicht... Warum?
 
Code:
function check (e) {

    // Escape: Suche schließen, klappt
    if (e.keyCode == 27) {
        closeResults();
    }
    
    // F2: Suche anzeigen, klappt nicht
    if (e.keyCode == 113) {
        showSearchForm();
    }

    if (typeof e.preventDefault == "function") {
        e.preventDefault();
    } else {
        e.returnValue = false;
    }

}
Würde mir jetzt einfallen. Evtl ist das auch aus Sicherheitsgründen inzwischen verboten im IE.
 
Hallo, danke für die Antwort, klappt aber leider nicht...

Ist es grundsätzlich eine schlechte Idee, F2 dafür zu verwenden? Ich mag halt den Gedanken, dass die Suchfunktion über eine Taste aufrufbar ist... Und warum stellt das eine Sicherheitslücke dar?

Gruß
Jens
 
Hm? onkeypress verwende ich ja. Und onclick ergibt wenig Sinn.

Aber: Von dir inspiriert habe ich aber mal onkeydown verwendet, und siehe da, es läuft im IE. Verrückte Welt. Aber ich danke für die Anregung. :-)

Warum kann ich F2 abfragen mit onkeydown aber nicht mit onkeypress?
 
Status
Für weitere Antworten geschlossen.
Zurück
Oben