2010-09-22 21 views
28

¿Hay algún atributo como tab-index?¿Puedo establecer dinámicamente tabindex en JavaScript?

CONTEXTO: Estoy haciendo que una sección en un formulario web sea visible o invisible dependiendo de alguna condición en la que desee establecer el índice de pestañas manualmente cuando esa sección en particular esté visible.

Respuesta

42
document.getElementById("link3").tabIndex = 6; 
+4

1 para su avatar – MooGoo

+5

$ ('# link3 ') .attr (' tabIndex ', 6); // para jQuery – marklark

+0

El atributo es 'tabindex' pero' el.tabindex' no funciona, pero 'el.tabIndex' sí lo hace. Tan raro. –

0

Crear y restablecer dinámicamente tabIndex de elementos HTML.

El atributo tabindex especifica el orden de tabulación de un elemento HTML, como el conjunto de "li", "a" e.t.c. El atributo tabindex es compatible con todos los principales navegadores.

Para esta instancia, configure set tabindex para los elementos de la lista "li". Por lo general, tabindex comenzará desde '0', sin embargo, podemos restablecerlo para comenzar desde '1'. Estoy usando Jquery para hacer esto.

See It Working Here

<ul id="dfruits"> 
<li>Apple</li> 
<li>Dragonfruit</li> 
<li>Damson</li> 
<li>Cloudberry</li> 
<li>Blueberry</li> 
<li>Cherry</li> 
<li>Blackcurrant</li> 
<li>Coconut</li> 
<li>Avocado</li> 
<li>Pinaple</li>  
</ul> 

$(document).ready(function() { 

var 
SomeFruitsList=$("ul#dfruits li"), 
//set tab index to starts from 1 
tabindex = 0; 

SomeFruitsList.each(function() { 
// add tab index number to each list items 
    tabindex++; 
$(this).attr("tabindex","TabIndex " +tabindex); 

var tabIndex = $(this).attr("tabindex"); 
// add tab index number to each list items as their title 
$(this).attr("title",tabIndex); 

    $(this).append('<br/><em>My tabIndex is number: '+tabIndex+'<em>') 
}) 
    }); 
4

Usando JQuery podemos configurar dinámicamente índice de tabulación fácilmente Prueba este código- establece la tabindex e incrementar la variable

$(function() { 
    var tabindex = 1; 
    $('input,select').each(function() { 
     if (this.type != "hidden") { 
      var $input = $(this); 
      $input.attr("tabindex", tabindex); 
      tabindex++; 
     } 
    }); 
}); 
+0

¡Esto es perfecto, gracias! –

Cuestiones relacionadas