Wie kann ich Klickereignisse in deaktivierten Eingabefeldern browserübergreifend verarbeiten?

Klicken Sie auf Ereignisbehandlung bei deaktivierter Eingabe

In einem HTML-Dokument reagiert ein deaktiviertes Eingabefeld nicht auf Mausereignisse. Während es in einigen Browsern möglicherweise möglich ist, Ereignisse von der deaktivierten Eingabe an übergeordnete Elemente weiterzugeben, unterstützt Firefox dieses Verhalten nicht. Daher ist eine Problemumgehung erforderlich, um die Ereignisbehandlung für deaktivierte Eingaben browserübergreifend zu ermöglichen.

Eine Lösung besteht darin, ein transparentes div-Element über der deaktivierten Eingabe zu platzieren. Dieses Div erfasst das Klickereignis und löst eine Aktion aus, z. B. das Entfernen des deaktivierten Attributs aus der Eingabe und das Setzen des Fokus.

Beispiel-HTML:

<div>
<p><strong>jQuery:</strong></p>
<pre class="brush:php;toolbar:false">$("div > div").click(function (evt) {
    $(this).hide().prev("input[disabled]").prop("disabled", false).focus();
});

Dieses Skript verbirgt das div-Element nach einem Klick und aktiviert die deaktivierte Eingabe. Die Eingabe wird ebenfalls fokussiert, sodass der Benutzer sofort damit interagieren kann.

Arbeitsbeispiel:

http://jsfiddle.net/RXqAm/170/

Durch die Implementierung dieser Problemumgehung können Entwickler sicherstellen, dass deaktivierte Eingabefelder weiterhin Klickereignisse empfangen und gewünschte Aktionen in allen gängigen Browsern auslösen können.