Bagaimana membuat elemen yang dapat dipilih di AJAX untuk Pemrograman HTML5 dan CSS3 - dummies

Anda mungkin memiliki situasi di mana Anda ingin pengguna memilih dari daftar elemen. AJAX memungkinkan pemrogram HTML5 dan CSS3 pilihan itu. Widget yang dapat dipilih adalah cara yang bagus untuk membuat fungsi ini dari daftar biasa. Pengguna dapat menarik atau Ctrl + klik item untuk memilih mereka. Kelas CSS khusus secara otomatis diterapkan untuk menunjukkan bahwa item dipertimbangkan untuk dipilih atau dipilih.

Ikuti langkah-langkah ini untuk membuat elemen yang dapat dipilih:

1. Mulailah dengan daftar unordered.

   Buat daftar unordered standar di HTML Anda. Berikan ul ID sehingga bisa diidentifikasi sebagai jQuery node:

   
   selectable
   
   alpha
   beta
   gamma
   delta
   
   
   
   
   
   
   
   
   

2. Tambahkan kelas CSS untuk memilih dan negara terpilih.

   Jika Anda ingin agar item yang dapat dipilih berubah sewaktu item dipilih atau telah dipilih, tambahkan kelas CSS seperti yang ditunjukkan. Beberapa kelas khusus (dipilih ui dan dipilih ui) telah ditentukan sebelumnya dan akan ditambahkan ke elemen pada waktu yang tepat:

   h1 {text-align: center;} #selectable. ui-memilih {background-color: gray;} #selectable. dipilih ui {background-color: black; warna: putih;}
   

3. Pada fungsi init () , tentukan daftarnya sebagai simpul yang dapat dipilih.

   Gunakan sintaks jQuery standar: selectable ().

   $ ("# dapat dipilih"). dapat dipilih();
   

Kelas melekat pada semua elemen saat mereka terpilih. Pastikan untuk menambahkan beberapa jenis CSS ke kelas ini, atau Anda tidak dapat mengetahui bahwa item telah dipilih.

Jika Anda ingin melakukan sesuatu dengan semua item yang telah dipilih, cukup buat kelompok elemen jQuery dengan kelas yang dipilih ui:

var selectedItems = $ ("ui-selected");