IE Fehler Auslöser klicken für 2 Tasten?

8

Ich versuche, die Übermittlungsschaltfläche auszulösen, wenn ein Benutzer die Eingabetaste drückt. Funktioniert hervorragend für alle Browser außer Internet Explorer 9. Seltsam ist, dass IE darauf besteht, auch den Klick für einen anderen Knopf auszulösen, den ich ihm nie gesagt habe. Mache ich etwas falsch oder wie repariere ich das?

Unten ist mein Code. Durch Drücken der Eingabetaste in IE wird der Übergabeklick wie erwartet ausgelöst, aber aus irgendeinem Grund wird auch der Klick auf "einige Schaltflächen" ausgelöst (auch ohne meinen Tastendruck-Listener):

%Vor%

Sie können den Fehler in Aktion hier sehen: Ссылка

    
TruMan1 24.05.2012, 14:28
quelle

4 Antworten

15

Hier sind ein paar Dinge zu beachten:

IE9 zählt das Element <button/> standardmäßig als type="submit" . Um es nicht unterzubringen, müssen Sie explizit sein:

%Vor%

Wenn Sie das tun, werden Sie feststellen, dass das emulierte Ereignis click jetzt nicht <button/> auslöst, sondern immer noch 2 Ereignisse auslöst. Der Grund dafür ist, dass IE9, weil Sie ein <form/> -Element nicht explizit definiert haben, davon ausgeht, dass die Steuerelemente in einem Formular sind. Wenn Sie enter in der Textbox drücken, werden 2 Ereignisse ausgelöst:

  • dasjenige, das Sie emulieren
  • das Standardverhalten des Formulars zum Senden von Schaltflächen

Um dieses Problem noch einmal zu umgehen, müssen Sie explizit sein:

%Vor%

Nun, das sind die Gründe, warum Sie das Verhalten in IE sehen. @MrSlayer beantwortet die zweite Ausgabe des keypress -Ereignisses, nachdem Sie es zufriedenstellend bearbeitet haben. co_de%

    
bPratik 24.05.2012, 14:42
quelle
5

Die Eingabetaste hat ein Standardverhalten zum Übermitteln, daher müssen Sie die Ausführung des Standardverhaltens verhindern. Da das button -Tag standardmäßig type="submit" ist, wird diese Schaltfläche beim Drücken der Eingabetaste ausgeführt.

%Vor%     
Quantastical 24.05.2012 14:45
quelle
1

Wie wäre es, wenn Sie das Senden des Formulars statt eines Klickens auslösen?

%Vor%

- BEARBEITEN -

leicht aktualisiert, um die Ereignisausbreitung zu stoppen.

    
Jeff Sheldon 24.05.2012 14:32
quelle
1

Zunächst müssen Sie kein Ereignis manuell anhängen, um ein Formular zu senden, wenn der Benutzer enter drückt - der Browser verarbeitet das bereits.

Seltsamerweise hat dies mit der Reihenfolge der Elemente, den impliziten Form-Assoziationen und der Tatsache zu tun, dass der IE Buttons als Submit-Elemente behandelt.

Versuchen Sie, die Reihenfolge dieser Schaltflächen zu ändern, um zu sehen, was ich meine:

%Vor%

Natürlich wird der Browser bereits angewiesen, auf die Eingabe Enter auf einer Texteingabe zu reagieren. Dies führt dazu, dass der Browser auf die zugehörige Senden-Schaltfläche klickt. Da Sie form oder verknüpfte Elemente nicht explizit über ihr form -Attribut angegeben haben, versucht der Browser, diese Beziehung für Sie herzustellen.

In Ihrem Code wurde das Element <button> als Übergabeschaltfläche der Texteingabe angenommen (weil es die erste Übergabeschaltfläche im impliziten Format war). Wenn Sie also bei der Texteingabe Enter drücken, löst der Browser natürlich das Klickereignis der zugehörigen Schaltfläche aus.

Wenn Sie die Elemente wie oben beschrieben neu ordnen, sehen wir das Gegenteil. IE verknüpft das andere Element <input> mit der Textbox. Wenn Sie Enter in der Textbox drücken, wird das click -Ereignis implizit ausgelöst.

Sie können dieses Verhalten bestätigen, indem Sie die .form -Attribute verschiedener Elemente vergleichen. Wenn Sie zum Beispiel einige id -Werte hinzufügen, erhalten Sie einfacheren Zugriff auf diese:

%Vor%

Führen Sie dann einige schnelle Vergleiche durch:

%Vor%

Letztendlich liegt es an Ihnen, die Mehrdeutigkeit zwischen den beiden Schaltflächen zu entfernen, indem Sie das <button> -Element so deklarieren, dass es type='button' ist, oder indem Sie es nach der beabsichtigten Schaltfläche zum Absenden platzieren.

    
Sampson 24.05.2012 15:07
quelle