Mit jQuery Tabindex Probleme zu umgehen

Question

Ich versuche zu steuern, meine Formulare und wie der Benutzer mit ihnen über die Formularelemente 'tabindex Eigenschaft interagiert. Alle meine Elemente haben tabindex angegeben, und ich möchte diesen Wert respektiert und ordnungsgemäß verwendet werden.

Ich entwickle gerade auf Mac/Firefox und ich bin mir der Standard-Mac-Systemeinstellung bewusst, die Tab-Switching nur auf Eingabeelemente und Listen setzt. Ich möchte jedoch diese und alle anderen Einstellungen, die auf jedem System/Browser auftreten können, außer Kraft setzen.

Ich benutze jQuery, um dies zu umgehen. Hier ist mein Code an dieser Stelle:

$(":input").keypress(function(e){ 
    if (e.which == 0) 
    { 
     tindex = parseInt($(this).attr("tabindex")) + 1; 
     $(":input[tabindex='" + tindex + "']").focus(); 
    } 
}); 

Allerdings funktioniert dies nicht in der Art, wie ich es will. Wenn die Standard-Mac-Einstellung aktiviert ist, überspringt dies tatsächlich einen Tabindex und überspringt alle Nicht-Text-/Textbereich-Elemente. Zum Beispiel, wenn ich auf input[tabindex=2] bin und ich die "Tab" -Taste drücke, werde ich an input[tabindex=4] gesendet. Wenn ich auf input[tabindex=2] bin und es eine select Box zwischen input[tabindex=2] und input[tabindex=4] gibt, werde ich an input[tabindex=5] gesendet.

Ich möchte input[tabindex=2] senden Sie mich an input[tabindex=3], select[tabindex=3], input[type=radio][tabindex=3], etc .; Grundsätzlich was auch immer hat tabindex von 3.

Lassen Sie mich wissen, irgendwelche Ideen, um dieses Problem zu umgehen. Bitte teilen Sie mir auch mit, wenn Sie etwas anderes auf anderen Systemen/Browsern kennen, die ich betrachten sollte.

Answer 1

Fügen Sie e.preventDefault(); zu Ihrem keypress Event-Handler hinzu. Dadurch wird verhindert, dass der Browser seine Standardaktion für dieses Ereignis ausführt. Dadurch wird auch verhindert, dass der Browser einem Link folgt, wenn er in einem Klick-Handler platziert wird.

Siehe documentation.