¿Cómo omito elementos al tabbrar sin usar tabindex?

Question

¿Hay una buena manera, en un manejador onfocus Javascript(), de trampolín el enfoque al siguiente elemento en el orden de tabulación, sin tener que introducir manualmente el identificador del elemento que debe ser el siguiente?

I construyó un selector de fechas HTML en Django/jQuery. Es una edición de línea seguida de un ícono de calendario que muestra un calendario. Quiero poder desplazarme de la edición de línea a la siguiente entrada, omitiendo el enlace para el icono de calendario. Quiero decir que es un widget generalizado, así que no puedo codificar el ID de lo que viene a continuación y llamar a .focus(). Sé que podría establecer atributos de tabindex en todo, pero eso es más manual de lo que me gustaría. Además, iirc, eso no evitaría que tome el foco, simplemente lo pondría al final del orden de tabulación.

Answer 1

Tal vez:

$("#your-calendar-icon").focus(function() { 
    $(this).trigger("blur"); 
); 

Answer 2

Utilice un div alrededor del icono de calendario en lugar de un enlace. Luego adjunte sus eventos de calendario a la div. Por defecto, el div no será una tabulación.

Answer 3

Comprobación de los recursos esta:

• Getting, setting, and removing tabindex values with JavaScript
• jQuery Tabindex Plugin

Answer 4

o:

$("#your-calendar-icon").focus(function() { 
    $(somethingElse).trigger("focus"); 
}); 

Answer 5

Si siempre va a ser la entrada después de que el calendario entonces por qué no:

$('#your-calendar-icon').focus(function() { 
    $(this).next('input').focus(); 
}); 

Personalmente, yo diría que si va a ser un complemento, debe simplemente hacer que el siguiente elemento sea una opción de configuración que tenga un valor predeterminado, y especificar el valor predeterminado en los documentos.

Answer 6

Conjunto tabindex = "-1" para que el control y el navegador se saltará que el control de tabulación.

Answer 7

Como @thetacom dice, sólo se puede utilizar otro tipo de elementos, uno que no recibe el foco. En caso de que aún desee conservar parte de la función de ,, puede probar SkipOnTab.

SkipOnTab: Complemento jQuery para eximir los campos de formulario seleccionados del orden de tabulación de reenvío.

Simplemente agregue data-skip-on-tab="true" al icono selector de fecha (u otros elementos/contenedores) que desea omitir. Usted todavía puede hacer clic para activar el selector de fechas o volver usando cambio - pestaña y utilizar la tecla enter.

Ver the simple demo y the business case demo.