Latest web development tutorials

jQuery UI API -: Pemilih tabbable

kategori

Pemilih (Penyeleksi) | UI inti (UI Core)

pemakaian

tab Pilih Pengguna elemen fokus utama bisa lewat: deskripsi.

jQuery( ":tabbable" )

Beberapa elemen itu sendiri difokuskan melalui tombol tab (tabbable), sedangkan unsur-unsur lain perlu secara eksplisit mengatur indeks tab positif. Dalam kedua kasus, dalam rangka untuk fokus melalui tombol tab (tabbable), elemen harus terlihat.

Berikut jenis elemen tanpa indeks tab negatif dan belum dinonaktifkan, difokuskan melalui tombol tab (tabbable): input , select , textarea , button dan object . Jika jangkar dengan href atau positif tabindex atribut, difokuskan (tabbable) melalui tombol tab. area unsur Jika peta bernama, dan dengan href atribut, dan ada gambar terlihat menggunakan peta, itu difokuskan melalui tombol tab (tabbable). Semua lainnya hanya berdasarkan tabindex atribut elemen dan visibilitas difokuskan melalui tombol tab (tabbable).

CATATAN: tab elemen dengan indeks negatif adalah :focusable , tidak :tabbable .

contoh

Pilih fokus utama tab melalui elemen, dan disorot dengan perbatasan merah. 

<! DOCTYPE html>
<Html lang = "en">
<Head>
  <Meta charset = "utf-8">
  <Title>: tabbable Selector Contoh </ title>
  <Link rel = "stylesheet" href = "// code.jquery.com/ui/1.10.4/themes/smoothness/jquery-ui.css">
  <Gaya>
  masukan {
    border: 1px solid # 000;
  }
  div {
    padding: 5px;
  }
  </ Style>
  <Script src = "// code.jquery.com/jquery-1.10.2.js"> </ script>
  <Script src = "// code.jquery.com/ui/1.10.4/jquery-ui.js"> </ script>
</ Kepala>
<Body>
 
<Div> <value input = "no tabindex"> </ div>
<Div> <input tabindex = "5" value = "tabindex positif"> </ div>
<Div> <input tabindex = "- 1" value = "tabindex negatif"> </ div>
 
<Script>
$ ( ": Tabbable") Css ( "border-color", "merah");
</ Script>
 
</ Body>
</ Html>