Interfete 4 Web - Carcoteala zilnica despre interfete web: Javascript - tabIndex pentru butoane

Javascript - tabIndex pentru butoane

Download exemplu

Miercuri la laborator s-a vorbit putin despre ultima tema la IE. Studentii vor avea de facut interfete web care sa indeplineasca anumit cerinte. Printre cerinte se numara si problema navigarii cu ajutorul tastei tab. De multe ori se intampla ca ordinea de navigare prin tab-uri sa nu corespunda cu ordinea logica in care au fost puse butoanele / campurile in pagina. De aceea ar trebui sa setam proprietatea de tabIndex pentru fiecare buton.

Mai jos am creat un mic exemplu in care m-am jucat cu ordinea de navigare:










Box 1:
Box 2:
Box 3:



Declararea unui buton cu proprietatea de tabIndex setata ar arata cam asa:

< button id="b1" tabIndex="1"> Button 1</button>

Pentru a obtine valoarea tabIndex putem scrie:

var b1=document.getElementById('b1').tabIndex;
document.write("Tab index of Button 1: " + b1);

In cazul in care vrem sa navigam intre campurile unei forme vom seta tot proprietatea tabIndex:

< form name=yourform>
Box 1:
< input type=text name=box1 tabIndex="5" onFocus="nextfield ='box3';">
</form>

Un exemplu complet puteti vedea aici iar codul poate fi descrcat din sectiunea download al site-ului nostru

Niciun comentariu:

Trimiteți un comentariu