Saltar al contenido

¿Para qué sirve tabindex=”-1″ en bootstrap?

Esta es el arreglo más válida que encomtrarás brindar, sin embargo mírala pausadamente y valora si se puede adaptar a tu trabajo.

Solución:

los tabindex attribute define explícitamente el orden de navegación de los elementos enfocables (normalmente enlaces y controles de formulario) dentro de una página. También se puede utilizar para definir si los elementos deben ser enfocables o no.

[Both] tabindex="0" y tabindex="-1" tienen un significado especial y proporcionan una funcionalidad distinta en HTML. un valor de 0 indica que el elemento debe colocarse en el orden de navegación predeterminado. Esto permite elementos que no son enfocables de forma nativa (como

, y

) para recibir el foco del teclado. Por supuesto, generalmente se deben usar enlaces y controles de formulario para todos los elementos interactivos, pero esto permite que otros elementos sean enfocables y activen la interacción.

A tabindex="-1" valor elimina el elemento del flujo de navegación predeterminado (es decir, un usuario no puede tabular), pero le permite recibir enfoque programáticolo que significa que el foco se puede configurar desde un enlace o con secuencias de comandos. ** Esto puede ser muy útil para elementos a los que no se deben tabular, pero que pueden necesitar tener el foco establecido en ellos.

Un buen ejemplo es un ventana de diálogo modal – cuando se abre, el enfoque debe establecerse en el cuadro de diálogo para que comience un lector de pantalla lectura y el teclado comenzará navegando dentro del diálogo. Debido a que el diálogo (probablemente solo un

elemento) no es enfocable por defecto, asignándolo tabindex="-1" permite establecer el foco en él con secuencias de comandos cuando se presenta.

un valor de -1 también puede ser útil en widgets y menús complejos que utilizan flechas keys o otro atajo keys para asegurarse de que solo un elemento dentro del widget sea navegable con la pestaña keypero aún permite que el foco se establezca en otros componentes dentro del widget.

Fuente: http://webaim.org/techniques/keyboard/tabindex

Esta es la razón por la que necesitas tabindex="-1" en el modal

, para que los usuarios puedan acceder a los métodos abreviados de ratón y teclado comunes. Espero que ayude.

El índice de pestañas attribute está asociado con HTMLno es específico de Bootstrap.

Esta propiedad es responsable de indicar si un elemento es accesible mediante la navegación del teclado.

Debe tener en cuenta tres escenarios diferentes:

  1. Al agregar tabindex = "0" a un elemento, esto significa que es accesible mediante la navegación del teclado, pero el orden está definido por el orden de origen de los documentos.

  2. Cuando agregando un valor positivo al tabíndice attribute (por ejemplo tabindex = "1", tabindex = "2") esos elementos son accesibles mediante la navegación del teclado y el orden se define por el valor de la attribute.

  3. Cuando agregando un valor negativo a tabindex (generalmente tabindex="-1") significa que el elemento es no se puede acceder mediante la navegación del teclado, pero se puede enfocar usando la función de enfoque en JS.

Si crees que te ha sido útil este post, agradeceríamos que lo compartas con otros desarrolladores de esta manera contrubuyes a extender esta información.

¡Haz clic para puntuar esta entrada!
(Votos: 0 Promedio: 0)



Utiliza Nuestro Buscador

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *