Атрибут tabindex

Атрибут tabindex поставља редослед добијања фокуса приликом преласка између елемената помоћу тастера Tab.

Притискањем овог тастера могуће је активирати узастопно неке елементе странице (линкове и елементе форми). Активни елементи ће добијати улазни фокус.

За поља уноса типа input и textarea фокус ће се исказати у томе што ће у пољу треперити курсор и у њега ће се моћи уносити текст, за линкове и друге елементе то ће бити истицање на неки начин (подвлачење, окруживање испрекиданом границом и слично, зависи од прегледача).

Ако у тренутку добијања фокуса елемент није био видљив на страници (због скроловања), онда ће се страница скроловати до тог елемента.

Ако елементима није задат атрибут tabindex или има вредност 0, онда ће прелазак преко њих тастером Tab ићи по редоследу којим се елементи јављају у HTML коду.

Ако на страници постоје елементи којима је задат tabindex, онда ће прелазак најпре ићи преко њих, почевши од мање вредности атрибута tabindex (најмања може бити јединица) и тако даље по растућим вредностима атрибута, а када такви елементи нестану - прелазак ће поћи преко оних елемената, којима није задат tabindex или има вредност 0.

Вредност атрибута су цели бројеви од 1 до бесконачности. Ако неки бројеви недостају - ништа страшно се неће десити (на пример, ако нема броја 2, онда ће фокус најпре доћи на елемент са tabindex, једнаким 1, а затим на елемент са tabindex, једнаким 3).

Ако на страници у тренутку притиска тастера Tab постоји елемент у фокусу (фокус је могао бити добијен не само притиском Tab, већ и кликом мишем по елементу или атрибутом autofocus), онда ће следећи притисак тастера Tab довести до тога да фокус добије следећи по редоследу елемент после оног који је у фокусу (на пример, ако је тренутно у фокусу елемент са tabindex 3, онда ће следећи добити фокус елемент са tabindex 4).

Ако је пољу уноса задат атрибут disabled, оно ће бити игнорисано приликом прелаза преко тастера Tab, чак и ако је том пољу задат атрибут tabindex.

Атрибут tabindex примењује се на тагове a, input, textarea, button, select, area.

Пример

Хајде да инпутима задамо атрибут tabindex. Притисните узастопно тастер Tab и видећете, како ће се улазни фокус пребацивати са првог инпута на четврти, а затим ићи преко линкова са почетка странице (јер више нема елемената са задатим атрибутом tabindex):

:

Погледајте такође