Latest web development tutorials

jQuery를 UI의 API - : tabbable 선택기

범주

선택기 (선택기) | UI를 코어 (UI 코어)

용법

설명 : 키 초점 요소가 통과 할 수 사용자 선택 탭을 클릭합니다.

jQuery( ":tabbable" )

다른 요소가 명시 적으로 긍정적 인 탭 인덱스를 설정해야합니다 동안 일부 요소 자체는 탭 키 (tabbable)를 통해 초점을 맞추고 있습니다. 두 경우 모두에서, 탭 키 (tabbable)를 통해 집중시키기 위해, 소자를 표시한다.

: 음의 탭 인덱스를 갖는 비활성화되지 않았습니다없는 요소의 다음과 같은 유형은, 탭 키 (tabbable)를 통해 초점을 맞추고 input , select , textarea , button 및 object . 와 앵커 경우 href 또는 긍정적 tabindex 속성은, 탭 키를 통해 (tabbable) 초점을 맞추고 있습니다. area 명명 매핑하면과 함께 소자 href 특성 맵을 이용하여 가시적 이미지가, 그것 Tab 키 (tabbable)으로 집중된다. 만을 기준으로 다른 모든 tabindex 요소의 특성 및 가시성 탭 키 (tabbable)를 통해 초점을 맞추고 있습니다.

주 : 음의 인덱스 탭 요소입니다 :focusable ,하지 :tabbable .

예

요소를 통해 탭 키 포커스를 선택하고 빨간색 테두리로 강조했다. 

<! DOCTYPE html로>
<HTML LANG = "EN">
<헤드>
  <메타 문자 집합 = "UTF-8">
  <제목> : tabbable 선택기 예 </ 제목>
  <링크 REL = "스타일 시트"HREF = "// code.jquery.com/ui/1.10.4/themes/smoothness/jquery-ui.css">
  <스타일>
  입력 {
    국경 : 1 픽셀 고체 # 000;
  }
  사업부 {
    패딩 : 5px;
  }
  </ 스타일>
  <스크립트 SRC = "// code.jquery.com/jquery-1.10.2.js"> </ script>
  <스크립트 SRC = "// code.jquery.com/ui/1.10.4/jquery-ui.js"> </ script>
</ 헤드>
<바디>
 
<DIV> <입력 값 = "아니오의 tabindex"> </ DIV>
<DIV> <입력의 tabindex = "5"값 = "양의 tabindex"> </ DIV>
<DIV> <입력의 tabindex = "- 1"값 = "부정의 tabindex"> </ DIV>
 
<스크립트>
$ ( "Tabbable")에 .css ( "테두리 색상", "빨간색");
</ 스크립트>
 
</ BODY>
</ HTML>