Tab鍵的適當設置

在網頁瀏覽中，可以通過使用Tab鍵來切換元素焦點，如在頁面表單中input元素、checkbox、超鏈接。我們不必設定它們的tabIndex值，如此頁面會按照DOM的樹形結構自動選取合適的下一個切換點。

tabIndex使用演示1 ；

tabIndex的合法值：...-3,-2,-1,0,1,2,3...

說明：

  The tabIndex value determines the tab order as follows:

1. Objects with a positive tabIndex are selected in increasing p order and in source order to resolve duplicates.
2. Objects with an tabIndex of zero are selected in source order.
3. Objects with a negative tabIndex are omitted from the tabbing order.

當tabIndex屬性設置爲-1，Tab鍵就不會索引到該元素；在實際案例中我們可能使用onclick()事件選擇如何處理各元素的tab位移、元素焦點，如果不設置tabIndex，則可能出現按下Tab後焦點“跳動”現象-先按照默認規則跳至A元素、再根據onclick()中處理邏輯跳轉到指定B元素。

當然，HTML不會對隱藏的元素納入tab切換順序，所以如果滿足需求的話，可以通過CSS將其隱藏：display:none; visibility:hidden; .

 更多tabIndex說明參考微軟官網說明。