31
¿En qué orden se enfocan los elementos con un valor de tabindex cuando se tabula la página web?¿Dónde terminan los elementos HTML tabindex = "0" en el orden de tabulación?
A
Respuesta
29
Los HTML specification estados:
elementos que han tabindex idéntica valores deben ser navegados en el orden en que aparecen en el carácter corriente.
+3
¿Qué significa secuencia de caracteres? – HELP
+4
Una secuencia de caracteres. –
+6
@snufey, el orden en que aparecen en el (x) html mark-up del documento es una interpretación tan buena como cualquiera. Por lo tanto, dos elementos de valores 'tabindex' idénticos se centrarán en el primero en aparecer primero en el marcado, y luego pasar al siguiente (pero recuerde que el orden en la página * no * equivale a ordenar en la marca- arriba, debido a css). –
22
Es un poco más complicado que la respuesta de Alan Haggai Alavi.
Después del análisis, IE8 y Opera hacen lo que dice la especificación HTML4. Sin embargo, Firefox y Chrome usan el orden DOM. Esto es importante con un etiquetado mal formado como este.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Test case 1</title>
</head>
<body>
<form>
<table>
<tr><td><input id="first" value="first in the character stream" tabindex="0"></td></tr>
<div><input id="second" value="second in the character stream" tabindex="0"></div>
</table>
<form>
</body>
</html>
Usted bien podría argumentar que con el marcado incorrecto todas las apuestas están desactivadas de todos modos, ¿qué pasa con JavaScript?
Considere este caso:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Test case 2</title>
<script type="text/javascript">
moveFirst = function()
{
var f = document.getElementById("first");
f.parentNode.removeChild(f);
document.body.appendChild(f);
}
</script>
</head>
<body>
<form>
<table>
<tr><td><input id="first" value="first in the character stream" tabindex="0"></td></tr>
<tr><td><div><input id="second" value="second in the character stream" tabindex="0"></div></td></tr>
</table>
<form>
<div onclick="moveFirst()">move</div>
</body>
</html>
En este caso, cuando un usuario hace clic en "movimiento", IE8, Firefox, Chrome y Opera para uso DOM, no para flujo de caracteres.
Por último, HTML5 ofrece prácticamente ninguna garantía sobre el orden de tabulación entre los elementos que tienen un tabindex de 0, simplemente indicando que debe seguir las convenciones de la plataforma.
73
tabindex asignaciones se manejan de la siguiente manera (para los elementos que soportan el atributo tabindex):
- Los números positivos (1,2,3 ... 32767) se manejan con el fin pestaña.
- 0 se maneja en orden de origen (el orden que aparece en el DOM)
- -1 se ignora durante la tabulación pero se puede enfocar.
Esta información es tomada de: http://www.w3.org/TR/html401/interact/forms.html#adef-tabindex
+5
Sólo para enfatizar - números positivos se manejan primero, luego los elementos con tabindex de 0 y los elementos tabbable sin tabindex (en orden de aparición). – gpr
+1
Claro y concibe. Esta debería ser la respuesta aceptada. – nachtigall
+0
La parte “para los elementos que soportan el atributo' tabindex'”no es totalmente clara, como en especificaciones de HTML actuales (WHATWG: https://html.spec.whatwg.org/multipage/interaction.html#the-tabindex-attribute) se define como atributo global y solo históricamente los navegadores (fe Internet Explorer) no lo tuvieron en cuenta en elementos no interactivos per se. –
0
tabindex="0" puede incluir la tabulación de los elementos no página del navegador web, tales como la barra de direcciones URL.
Probado para ser el caso de Firefox 32.03.
Cuestiones relacionadas
- 1. Excluir explícitamente un elemento html del orden de tabulación
- 2. Orden de tabulación Delphi
- 3. DockPanel orden de tabulación
- 4. ¿Cómo omito elementos al tabbrar sin usar tabindex?
- 5. Cómo cambiar el orden de tabulación de entrada de formulario
- 6. Javascript/JQuery eliminar de tabindex
- 7. orden de tabulación en ASP.NET MVC 3 Ayudantes
- 8. Orden de tabulación en el constructor de interfaz?
- 9. Orden de tabulación en Vim minibufexplorer
- 10. El orden de los elementos en el diccionario
- 11. Cambiar el orden de los elementos
- 12. Como llegar los elementos en el orden correcto de iterador()
- 13. ¿Cómo puedo configurar el orden de tabulación en VB.NET?
- 14. Cambiar el orden de los elementos HTML cuando el diseño cambia en Responsive Web Design
- 15. cómo establecer el orden de tabulación en jquery
- 16. Comando personalizado y orden de tabulación
- 17. ¿Cómo se establece el orden de tabulación en Swing Java?
- 18. stack.ToList() en .NET - orden de los elementos?
- 19. Cómo cambiar el orden de los elementos en un dijit.form.Select
- 20. Configuración Orden de tabulación para QTableView en Qt 4.4
- 21. ¿Puede CSS realmente anular el orden de los elementos HTML en una página?
- 22. Establecer el orden de los elementos de los cambios?
- 23. Orden de los elementos devueltos mediante getElementsByTagName()
- 24. Cómo deshabilitar y volver a habilitar tabindex de elementos ocultos/visibles?
- 25. tabindex en CSS
- 26. ¿Cómo configuro el orden de tabulación de los controles en Android?
- 27. "Orden de tabulación" en una aplicación de rieles
- 28. TabIndex en formato dinámico (los elementos aparecen según el caso) problema
- 29. Comparación de XML ignorando el orden de los elementos secundarios
- 30. ¿Cómo configurar tabindex en los campos de formularios?
, vale la pena señalar: en mi prueba tabindex = "0" es lo mismo que no tener un tabindex en un elemento – Kip
@Kip una diferencia que tabindex = "0" hace es que los elementos que normalmente no pueden tabularse pueden ser hecho tabtable agregando tabindex = "0", irónicamente sin realmente especificar un índice de tabulación para ellos. – Nat