TL; DR Wie kann ich dieses selbsterklärende JSFiddle zum Laufen bekommen?
Von dem W3C :
Das Blur-Ereignis tritt auf, wenn ein Element den Fokus entweder über das Zeigegerät oder über die Tab-Navigation verliert. Dieses Ereignis gilt für die folgenden Elemente: ETIKETT, EINGABE, AUSWÄHLEN, TEXTAREA und TASTE.
Die Grundidee, HTML:
%Vor%Und JS:
%Vor%Es funktioniert nicht. Ein anschaulicheres Beispiel ist dieses JSFiddle .
Ich habe auch focusout mit diesem JSFiddle ausprobiert, aber (vermutlich, weil es aus der Eingabe aufsteigt) , es feuert immer.
Ich könnte wahrscheinlich einrichten, was ich brauche mit einem Hack wie folgt: Ссылка aber ich würde es lieber nicht müssen .
Bearbeiten: Es gibt viele verwandte Fragen und ich habe alles gelesen, was ich finden konnte, nichts davon hilft. Einige sprechen davon, tabindex=0 für die Elemente form oder label festzulegen. Ich habe das in verschiedenen Permutationen versucht, aber es hilft nicht. JSFiedle hier . Wenn Sie es auf die Ereignisse form , blur events do setzen, wenn Sie außerhalb des Formulars klicken. Es gilt jedoch nicht für einen der untergeordneten Elemente. Es wird nichts aufgenommen, wenn Sie auf input und dann auf form klicken.
Edit 2: Ich verstehe einige der Antworten, die bisher gepostet wurden, nicht wirklich und keiner scheint wirklich zu funktionieren. Wie auch immer, um zu verdeutlichen, hier ist, was ich zu erreichen versuche:
In meiner App können Sie Tags zu Dokumenten hinzufügen. Wenn Sie auf die Schaltfläche "Tag hinzufügen" klicken, wird ein zuvor ausgeblendetes Texteingabefeld angezeigt. Und dann ...
Das Problem ist, dass # 1 und # 3 nicht kompatibel sind. Die Schaltfläche "Tag hinzufügen" muss abhängig davon, ob das Textfeld geöffnet oder geschlossen ist, eine andere Aktion ausführen. Da ich jedoch nur ein Onblur-Ereignis im Textfeld erreichen kann, wird das Textfeld durch den Zeitpunkt einer Aktion geschlossen passiert auf der "Add-Tag" -Taste für # 3.
Hier ist ein JFehler mit meinem bisher besten Versuch .
Das Ding, nach dem Sie suchen, ist
e.stopPropagation();
Diese Geige hier zeigt eine etwas andere Art und Weise, damit umzugehen ... es hat das Versteck auf ein Fenster geklickt (welches würde die Eingabe sowieso verwischen, außer auf der Beschriftung, wodurch das Klickereignis innerhalb des Labels gestoppt werden könnte.
Glückliche Kodierung!
Fügen Sie dieses Stück von js in Ihrer Geige hinzu. Sie haben einen Listener für das Label hinzugefügt, aber die Unschärfe passiert auf dem Anchor-Tag.
%Vor%Für eine Weile poste ich eine Zwischenentwicklung. Aber das wird Ihnen definitiv helfen, wo genau Sie suchen sollten. Die jquery-Implementierung, aber nicht Ihr JavaScript . Dies ist die eigentliche Sorge.
Ich habe 3 Zeilen an verschiedenen Stellen hinzugefügt. keine großen Änderungen.
|| $("input").css("visibility") == "visible" wurde zum if hinzugefügt
Bedingung $("input").css("visibility","hidden"); zur inneren else-Bedingung hinzugefügt $("input").css("visibility","visible"); an die äußere (und letzte) else-Bedingung. Bitte beachten Sie, dass dies eine Zwischenstufe ist. Sie müssen zweimal klicken, nachdem Sie einen nicht leeren Text eingegeben haben. Wenn ich Zeit bekomme, poste ich die richtige Arbeitssache. Das ist die Geige.
tobek, deine JSFiddle mit meinem besten Versuch bisher ist fast da. Das Problem ist der Selektor unten in diesem Codeabschnitt:
%Vor%Sie haben das Problem in Ihren Kommentaren richtig formuliert, als Sie sagten: "DAS PROBLEM: Wir kommen nie hier rein, weil es schon versteckt ist, weil der Eingang unscharf ist."
Ändern Sie den obigen Abschnitt und ich denke, Sie werden haben, was Sie suchen.
%Vor%Da der Link "Tag hinzufügen" innerhalb des Labels liegt, wird durch Klicken nicht die Funktion "Unschärfe" ausgelöst.
Tags und Links javascript html jquery javascript-events blur