Атрибут tabindex

Атрибут tabindex элементлар ўртасида ўтишда Tab калити ёрдамида фокус олиш тартибини белгилайди.

Бу калитни босиб, саҳифанинг айрим элементларини кетма-кет фаоллаштириш мумкин (ҳаволалар ва шакл элементлари). Фаол элементлар киритish фокусини оладилар.

input ва textarea турларидаги киритish майдонлари учун фокус, майдонда курсорнинг miltillashi ва унга матн киритиш мумкинлигида намоён бўлади, ҳаволалар ва бошқа элементлар учун эбер бу бирор усулда (таги чизиқ, нуқтали чекка билан айланиб чиқиш ва ҳ.к., браузерга боғлиқ) таъкидлаш бўлади.

Агар фокус олинган пайтда элемент саҳифада кўринмас бўлса (ажратиш сабаби), у ҳолда саҳифа шу элементга жойлашади.

Агар элементларга tabindex атрибути берилмаган бўлса ёки унинг қиймати 0 бўлса, у ҳолда Tab калити билан уларга ўтиш HTML коддаги элементлар кетма-кетлигида амалга ошади.

Агар саҳифада tabindex берилган элементлар мавжуд бўлса, у ҳолда ўтиш аввало улар бўйича, tabindex атрибутининг кичик қийматидан бошланади (энг кичик қиймат бир бўлиши мумкин) ва ҳ.к. атрибут қийматларининг orthib borishi билан давом этади, ва қачонки бундай элементлар тугаса - ўтиш tabindex берилмаган ёки унинг қиймати 0 бўлган элементлар бўйича давом этади.

Атрибутнинг қиймати 1 дан cheksizlikgacha бўлган бутун сонлардир. Агар айрим рақамлар ўтқазиб қўйилган бўлса - hech qanday dahshatli voqea bo'lmaydi (масалан, агар 2 рақами бўлмаса, аввало фокус tabindex 1 га тенг бўлган элементга тушadi, сўнгра эса tabindex 3 га тенг бўлган элементга).

Агар саҳифада Tab калити босилаган пайтда фокустаги элемент бўлса (фокус факат Tab ни босish билан эмас, балки sichqoncha bilan элементни босish ёки autofocus атрибути орқали ҳам олиниши мумкин), у ҳолда Tab калитини keyingi босилиши фокусдаги элементдан keyingi кетма-кетликдаги элемент фокусни олишига olib keladi (масалан, агар hozir фокусда tabindex 3 бўлган элемент бўлса, ундан keyin фокусни tabindex 4 бўлган элемент олади).

Агар киритish майдонига disabled атрибути берилган бўлса, у Tab калити орқали ўтишлар томонидан e'tiborsiz qoldiriladi, ҳатто агар бу майдонга tabindex атрибути берилган бўлса ҳам.

tabindex атрибути куйидаги тегларга қўлланилади: a, input, textarea, button, select, area.

Мисол

Келинг инпутларга tabindex атрибутини белгилаймиз. Tab калитини кетма-кет босиб кўринг ва сиз киритish фокуси биринчи инпутдан тўртинчисига қандай ўтишини кўрасиз, сўнгра саҳифа бошидаги ҳаволалар бўйича ўтади (чунки tabindex атрибути берилган элементлар бошқа йўқ):

<input type="text" tabindex="3" placeholder="number: 3">
<input type="text" tabindex="1" placeholder="number: 1">
<input type="text" tabindex="2" placeholder="number: 2">
<input type="text" tabindex="4" placeholder="number: 4">

Шунингдек кўринг

focus псевдокласси,
у элементнинг фокустаги uslublarini ўзгартиришга имкон беради