Cómo ignorar el elemento HTML de tabindex?
¿Hay alguna forma en HTML de decirle al navegador que no permita la indexación de pestañas en elementos particulares?
En mi página, aunque hay un sideshow que se representa con jQuery, cuando se tabula a través de eso, se obtiene una gran cantidad de pulsaciones de pestañas antes de que el control de pestañas se mueva al siguiente enlace visible en la página, ya que todas las cosas que se tabulan están ocultas para el usuario visualmente.
7 answers
Puede utilizar tabindex="-1".
La especificación W3C HTML5 admite valores negativos tabindex:
Si el valor es un entero negativo
El agente de usuario debe establecer la bandera de enfoque tabindex del elemento, pero no debe permitir que se alcance el elemento utilizando la navegación de enfoque secuencial.
Tenga cuidado, sin embargo, que esta es una característica de HTML5 y podría no funcionar con navegadores antiguos.
Para ser W3C HTML 4.01 estándar (de 1999) conforme, tabindex tendría que ser positivo.
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2013-04-15 09:57:45
No olvide que, aunque tabindex está todo en minúsculas en las especificaciones y en el HTML, en Javascript/el DOM esa propiedad se llama tabIndex.
No pierda la cabeza tratando de averiguar por qué sus índices de pestañas alterados mediante programación llamando a element.tabindex = -1 no está funcionando. Utilizar element.tabIndex = -1.
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2015-12-17 19:06:24
Si estos son elementos naturalmente en el orden de tabulación como botones y anclas, eliminarlos del orden de tabulación con tabindex=-1 es una especie de olor a accesibilidad. Si están proporcionando funcionalidad duplicada, eliminarlos del orden de pestañas está bien, y considere agregar aria-hidden = true a estos elementos para que las tecnologías de asistencia los ignoren.
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2014-06-13 10:42:18
Si está trabajando en un navegador que no es compatible con tabindex="-1", es posible que pueda salirse con la suya simplemente dando las cosas que deben omitirse un índice de pestañas muy alto. Por ejemplo tabindex="500" básicamente mueve el orden de tabulación del objeto al final de la página.
Hice esto para un formulario de entrada de datos largo con un botón lanzado en el medio de él. No es un botón que la gente haga clic muy a menudo, así que no quiero que accidentalmente ficha y pulse enter. disabled no funcionaría porque es un botón.
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2015-11-16 22:27:09
Tal hack como "tabIndex=-1" no funciona para mí con Chrome v53.
Esto es lo que funciona para chrome, y la mayoría de los navegadores:
element.removeAttribute('tabindex');
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2017-01-06 03:16:38
Simplemente agregue el atributo disabled al elemento (o use jQuery para hacerlo por usted). Deshabilitado evita que la entrada se enfoque o se seleccione en absoluto.
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2015-10-11 02:24:53
La forma de hacerlo es añadiendo tabindex="-1". Al agregar esto a un elemento específico, se vuelve inalcanzable por la navegación del teclado. Hay un gran artículo aquí que te ayudará a entender mejor tabindex.
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2018-05-04 09:08:32