morlock: IE lässt Fokus auf mehrere Elemente gleichzeitig zu (???)

SELF-Forum

IE lässt Fokus auf mehrere Elemente gleichzeitig zu (???)

morlock
– Informationen zu den Bewertungsregeln

Hallo zusammen!

Ich habe heute - auch als IE-leidgeprüfter HTML-Schreiberling - mal wieder ein große Überraschung erlebt.

Wir entwickeln seit einigen Jahren eine webbasierte Firmensoftware. Das System ist natürlich über die Jahre gewachsen und trägt aus den Anfangstagen noch einige "Altlasten" mit sich herum.
Wir haben nun vor einiger Zeit das System von (zugegebenermaßen nicht komplett validem) HTML 4.01 auf XHTML 1.0 Transitional umgestellt.

Soweit kurz zum Hintergrund, jetzt zur Headline:
Seit der Umstellung hatten wir teilweise eigenartige Phänomene - Benutzer haben Datenänderungen vorgenommen, die sie nach eigener Aussage nie getätigt haben.
Heute haben wir den Grund gefunden: IE lässt - zumindest unter bestimmten Bedingungen - mehrere Elemente gleichzeitig im Fokus. Auf der betroffenen Seite werden mehrere Bereiche per jQuery nachgeladen. Der IE setzt teilweise willkürlich den Fokus auf einen der nachgeladenen Buttons. Diese sind mit Javascripts versehen, die bestimmte Aktionen ausführen. Klickt ein Benutzer nun in ein Eingabefeld, ändert die Daten dort und drückt auf "Enter", wird die Aktion des Buttons ausgeführt, da dieser immer noch den Fokus hat.

Ich habe derartiges Verhalten noch nie gesehen - es passiert auch in keinem anderen Browser und offenbar auch nur bei den nachgeladenen Inhalten.

Hat irgendjemand schonmal so etwas erlebt oder eine Idee, wie ich das unterbinden kann? Ich bin für jeden Ansatz dankbar, weil ich bislang auch nirgendwo etwas vergleichbares im Netz gelesen habe.

Viele Grüße,
morlock

Beitrag melden
–
Informationen zu den Bewertungsregeln

  1. IE lässt Fokus auf mehrere Elemente gleichzeitig zu (???)

    molily
    +1 Informationen zu den Bewertungsregeln

    Hallo,

    Wir haben nun vor einiger Zeit das System von (zugegebenermaßen nicht komplett validem) HTML 4.01 auf XHTML 1.0 Transitional umgestellt.

    Warum auch immer man im Jahr 2011 auf XHTML 1.0 umstellt – aktuell ist (X)HTML 5.

    IE lässt - zumindest unter bestimmten Bedingungen - mehrere Elemente gleichzeitig im Fokus. … Ich habe derartiges Verhalten noch nie gesehen - es passiert auch in keinem anderen Browser und offenbar auch nur bei den nachgeladenen Inhalten.

    Konntest du schon ein minimales Testdokument bauen, mit dem sich das Problem nachvollziehen lässt? Um welchen IE handelt es sich?

    Hat irgendjemand schonmal so etwas erlebt oder eine Idee, wie ich das unterbinden kann? Ich bin für jeden Ansatz dankbar, weil ich bislang auch nirgendwo etwas vergleichbares im Netz gelesen habe.

    Was hast du denn schon probiert? Im Grunde gäbe es viele Ansätze, das zu verhindern. Zum einen kannst versuchen, manuell den Fokus zu korrigieren, sodass ein eventueller vorheriger Button-Fokus verloren geht. Zum anderen kannst du beim Absenden prüfen, ob das Feld, in welchem Enter gedrückt wurde, zum Formular des Submitbuttons gehört. Hast du in diese Richtung schon geforscht?

    Allgemein zum Thema Fokus und fokussiertes Element: http://molily.de/weblog/javascript-fokus-zentral

    Mathias

    Beitrag melden
    +1
    Informationen zu den Bewertungsregeln

    1. IE lässt Fokus auf mehrere Elemente gleichzeitig zu (???)

      morlock
      – Informationen zu den Bewertungsregeln

      Hallo Matthias!

      Warum auch immer man im Jahr 2011 auf XHTML 1.0 umstellt – aktuell ist (X)HTML 5.

      Da muss ich (zumindest etwas) widersprechen. HTML5 befindet sich noch nicht im finalen Stadium, die Fortführung von XHTML (die Version wäre 2) wurde eingestellt.
      Aber das soll hier keine Grundsatzdiskussion werden - natürlich stimme ich dir zu, dass man wenn möglich moderne Web-Standards nutzen sollte, nur ist das bei der Software nicht wirklich möglich (Zugriff erfolgt auch von außen, viele Mitarbeiter mit geringen EDV-Kenntnissen, teilweise recht alte PCs). Damit ist, auch wenn ich es beweine und betrauere, IE das Maß der Dinge und muss mindestens in den Versionen 8 und 9 fehlerfrei arbeiten. Es ist also schlicht erforderlich bei der Entwicklung relativ "konservativ" zu bleiben.

      Konntest du schon ein minimales Testdokument bauen, mit dem sich das Problem nachvollziehen lässt? Um welchen IE handelt es sich?

      Es handelt sich sowohl um IE 8 als auch 9 - 7 wurde noch nicht getestet, spielt aber auch keine wirkliche Rolle mehr.
      Ich arbeite noch an einem Testdokument. Die Schwierigkeit ist, dass es offenbar mit der Komplexität bzw. mit irgendwelchen Elementen der Seite zusammenhängt. Ca. 90% der betreffenden Seite werden dynamisch nachgeladen - bislang tritt das Problem auch nur in diesem Kontext auf.

      Was hast du denn schon probiert? Im Grunde gäbe es viele Ansätze, das zu verhindern. Zum einen kannst versuchen, manuell den Fokus zu korrigieren, sodass ein eventueller vorheriger Button-Fokus verloren geht. Zum anderen kannst du beim Absenden prüfen, ob das Feld, in welchem Enter gedrückt wurde, zum Formular des Submitbuttons gehört. Hast du in diese Richtung schon geforscht?

      Vielen Dank für deine Tips und Hinweise. Im Moment forsche ich noch, ob das Problem anderweitig schonmal aufgetaucht ist. Mir wäre es lieber zu verstehen woher es kommt und die Ursache zu unterbinden, als nur die Symptome zu bekämpfen.
      Ich werde auf jeden Fall auch einmal prüfen, ob eine Prüfung auf das fokussierte Element überhaupt Erfolg bringen würde (sprich, ob der IE mir das Eingabefeld oder den Button liefert).
      Eine Prüfung, ob das Element im richtigen Formular ist wird leider keinen Erfolg haben. Es existiert nämlich gar kein Submit-Button. Bei Änderungen in den dynamisch geladenen Bereichen werden diese per jQuery gepostet und die betreffenden (durch die Datenänderungen betroffenen) Bereiche nachgeladen.
      Als Randinfo: jQuery verursacht das Problem auch nicht - jedenfalls nicht exklusiv - wir hatten bis vor kurzem eine selbstentwickelte Javascript-Bibliothek im Einsatz, die die Inhalte nachgeladen hat. Auch mit dieser Bibliothek taucht das Problem auf. Dagegen tritt das Problem im "alten" Layout (also in HTML 4.01) weder mit unserer Bibliothek noch mit jQuery auf.

      Wenn ich neue Erkenntnisse habe poste ich wieder. Bin natürlich weiterhin für Hinweise dankbar.

      Grüße,
      morlock

      Beitrag melden
      –
      Informationen zu den Bewertungsregeln

      1. IE lässt Fokus auf mehrere Elemente gleichzeitig zu (???)

        morlock
        – Informationen zu den Bewertungsregeln

        Neue Erkenntnisse:

        Ich habe einige Zeit damit verbracht das Problem zu isolieren und in verschiedenen Zusammenhängen zu testen. Ich habe nun ein absolut minimales Setup für die Reproduktion geschaffen, bestehend aus zwei Dateien:

        _________________________________
        jqtest.html :

        <!DOCTYPE html
             PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
             "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
        <html xml:lang="en" lang="en" xmlns="http://www.w3.org/1999/xhtml">
        <head>
        <title>IE Bug - Test</title>
        <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
        </head>

        <body onload="$.post('jqtest\_button.html', '', function(dat) { document.getElementById('dyn\_content').innerHTML = dat; });">  

	<div id="dyn\_content">  
		  
	</div>  
	  
</body>

        </html>

        _________________________________

        jqtest_button.html :

        <input type="text" name="text123" value="test" />
        <button style="font-size:10px;" onclick="alert('das sollte nicht sein'); return false;">&auml;ndern</button>

        _________________________________

        Ich habe jQuery jetzt mal von Google aus eingebunden, damit man direkt testen kann. Sowohl im IE8 als auch im IE9 wird man feststellen, dass, wenn man sich im Textfeld befindet, etwas eingibt und "Enter" drückt, das onclick-Event des Buttons ausgelöst wird.

        Nun die interessanten Punkte:

        • schaltet man in den Kompatibilitätsmodus (IE 8 und 9), tritt der Fehler nicht auf
        • Fügt man um das input- und button-Element ein Formular mit Submit-Button ein, tritt der Fehler im IE8 nicht mehr auf, im IE9 schon
        • die Position des buttons scheint keine Rolle zu spielen. Im "echten" Fall sind auf der Seite mehrere Buttons vorhanden, die willkürlich betroffen sind (auch wenn es MEISTENS der selbe ist)
        • es hat offenbar nichts mit dem Doctype zu tun - auch mit 4.01 ist das Phänomen reproduzierbar, solange der IE im standardkonformen Modus (oder was er dafür hält) arbeitet.

        Hat jetzt noch jemand eine Idee?
        Und nebenbei: weiß jemand aus dem Kopf eine Anlaufstelle bei M$, bei der man solche Bugs melden kann? Dann muss ich nicht suchen :-)

        Viele Grüße,
        morlock

        Beitrag melden
        –
        Informationen zu den Bewertungsregeln

        1. IE lässt Fokus auf mehrere Elemente gleichzeitig zu (???)

          morlock
          – Informationen zu den Bewertungsregeln

          Entschuldigt den Mehrfach-Post, mir ist nur gerade noch eine Sache aufgefallen: selbst wenn man jQuery komplett rauslässt tritt der Fehler auf - man kann die Formularelemente also auch direkt in den div schreiben und der Fehler tritt auf (gerade getestet im IE 9).

          Gruß,
          morlock

          Beitrag melden
          –
          Informationen zu den Bewertungsregeln

          1. IE lässt Fokus auf mehrere Elemente gleichzeitig zu (???)

            morlock
            – Informationen zu den Bewertungsregeln

            Gefunden!

            Auch wenn kein anderer Browser dieses Verhalten an den Tag legt muss ich gestehen, dass ich dem IE doch nur bedingt einen Vorwurf machen kann - der Button muss natürlich typisiert werden (type="button"). Sonst wird er vom IE offenbar als type="submit" angenommen. Warum das - zumindest im IE 9 - auch so ist wenn man schon einen submit-button hat verstehe ich zwar nicht, aber sei's drum. Ich werde jetzt die Typisierungen für die Buttons hinzufügen (wundere mich hier über mich selbst, sonst typesiere ich immer) und mal sehen, ob noch Fehler auftreten.

            Vielleicht kann meine kleine Odyssee ja nochmal jemandem nützlich sein.

            Grüße,
            morlock

            Beitrag melden
            –
            Informationen zu den Bewertungsregeln