Wenn ich ein input innerhalb eines label habe, warum löst jedes Wort im Satz ein Klickereignis aus?
Hier ist ein jsFiddle für ein Beispiel. Egal welches Wort Sie im ersten Satz anklicken, das Ereignis wird ausgelöst.
Ich habe etwas CSS in input hinzugefügt, damit Sie sehen können, dass es egal ist, wo im ersten Label Sie sich befinden, es ist, als würden Sie über die Eingabe schweben. Ich habe auch ein zweites Label hinzugefügt, indem ich ein a -Tag innerhalb von label benutzt habe, was so funktioniert, als würde input funktionieren (das click -Ereignis wird nicht ausgelöst, wenn du auf ein Wort im Label klickst).
Meine zwei Fragen sind:
input in label so zu verwenden, dass label das Klickereignis nicht auslöst? Dies ist Teil der HTML-Spezifikation - label -Elemente erhöhen den Trefferbereich der verwandten input . Sie können den Klick selbst und preventDefault() verarbeiten, jedoch wird die Schaltflächenoberfläche beim Klicken nicht angehalten.
Alternativ können Sie die label -Elemente mit dem entsprechenden Stil in span ändern, damit sie sich genauso verhalten, obwohl Sie die Benutzererfahrung beeinträchtigen.