Menerapkan aplikasi tab tab, plugin ini relatif sederhana
File kode sumber:
tab.js
Prinsip Implementasi
1. Saat mengklik elemen, pertama -tama batalkan elemen yang disorot semula.
2. Kemudian sorot elemen yang diklik
3. Jika mengklik elemen adalah opsi di kotak drop-down, pilih sendiri dan juga pilih kotak drop-down.
5. Jika animasi didefinisikan, jalankan animasi terlebih dahulu dan kemudian panggilan balik
Analisis Kode Sumber:
1. Metode acara dipicu ketika suatu elemen diklik, yang akan memicu empat peristiwa berikut.
1.1. Hiden.bs.tab: Sembunyikan elemen sebelumnya
1.2. Show.bs.tab: tampilkan elemen saat ini
1.3. Hideen.bs.tab: diselesaikan dengan menyembunyikan elemen sebelumnya
1.4. Showed.bs.tab: tunjukkan elemen saat ini lengkap
1.5. Kode Sumber Acara Hiden/Show:
var $ sebelumnya = $ ul.find ('. Active: last a') var hideevent = $ .event ('hide.bs.tab', {terkait target: $ this [0]}) var showevent = $ .event ('show.bs.tab', {terkait target: $ sebelumnya [0]}))2. Aktif: Aktifkan objek saat ini
2.1. Tambahkan atribut yang diperluas aria ke elemen navigasi untuk menandai apakah elemen ini dalam keadaan diperluas
2.2. Menggunakan mekanisme reflow, gunakan atribut offsetwidth untuk mencapai pengecatan ulang parsial
Diskusi singkat di atas tentang Tab Analisis Kode Sumber Bootstrap (Tab) adalah semua konten yang saya bagikan dengan Anda. Saya harap ini dapat memberi Anda referensi dan saya harap Anda dapat mendukung wulin.com lebih lanjut.