Pertanyaan Saya perlu saran untuk plugin kotak pilih jQuery / CSS yang solid


Saat ini saya sedang mengerjakan proyek yang menggunakan plugin Dropkick.js untuk memilih kotak terpilih. Salah satu masalah yang kita hadapi adalah bahwa dropkick, sementara itu terlihat bagus, tidak mencerminkan metode, properti dan peristiwa dari kotak pilih.

Saya harus menulis banyak kode tambahan untuk menonaktifkan / mengaktifkan pilihan, mendapatkan dan menetapkan nilai-nilai dan sejumlah hal lain untuk hanya mendapatkan pilihan untuk bermain baik dengan sisa situs dan berinteraksi dengan elemen form lain.

Jadi kami beralih untuk menguji selectBox. Plugin fantasic dengan satu pengecualian: Jika Anda menghapus / menambahkan memilih o halaman melalui ajax dan jQuery, itu menghancurkan pengaturan pada setiap pilih di halaman. Ini menghasilkan pemilihan yang tidak dapat digunakan dan kesalahan JS di semua tempat. Karena kami melakukan banyak konten dinamis, ini tidak akan berhasil.

Apakah ada plugin pilih BAIK di luar sana yang memaparkan semua metode dan properti kotak pilihan, dapat ditata dengan baik, DAN berfungsi dengan konten dinamis?

Terima kasih atas saran Anda!


5
2017-11-16 15:05


asal


Jawaban:


Berikut beberapa opsi yang saya tahu (tanpa urutan tertentu):

StyleSelect

Situs web

Membungkus yang ada <select> tag, sehingga semua peristiwa, properti, dan sebagainya harus tetap dapat diakses. Gaya standarnya tidak bagus, dan ada batasan seberapa banyak yang bisa disesuaikan.

Terpilih

Situs web - Github

Gaya bawaan yang bagus, tetapi markup yang dihasilkan agak aneh dan tidak mendukung seluruh rentang callback yang mungkin Anda perlukan (hanya change)

jQuery UI Selectbox

Situs web - Github

Pilihan yang bagus jika Anda sudah menggunakan UI jQuery - jika tidak, berpotensi terlalu banyak overhead. Itu tidak menggunakan <select>Acara, tetapi memiliki callback yang setara (dan bahkan yang tidak hadir pada pengiriman reguler, seperti open/close). Juga itu ARIA patuh.

jStyling

Situs web - Github

Sekali lagi, bungkus aslinya <select> menandai. Mendukung disabled pilihan. Penataan standar cukup membosankan dan dirancang untuk mencakup lebih dari sekadar kotak pilihan (crumble yang mungkin tidak diinginkan).

Seragam

Situs web - Github

Mudah diterapkan, mendukung banyak tema. Kurangnya callback, kadang-kadang harus memaksa update elemen (sudah disebutkan), mencakup lebih dari sekadar kotak pilihan (sekali lagi, cruft yang mungkin tidak diinginkan).


10
2017-11-16 15:36



Seragam bekerja dengan baik dalam pengalaman saya. Jika Anda memperbarui nilai secara dinamis, Anda harus memanggil fungsi pembaruan, tetapi itu cukup mudah.


3
2017-11-16 15:08



Seragam terlihat keren!

Saya telah melihat metode serupa di sini: http://www.verot.net/jquery_select_skin.htm

Itu hanya menyembunyikan kotak pilih menggunakan opacity, dan overlay div yang dapat Anda gaya


1
2017-11-16 15:28



Saya baru-baru ini dirilis SelectBoxIt. Ini adalah selai dikemas dengan fitur jadi lihatlah.

SelectBoxIt Fitur Penting:

  • Gaya dengan jQueryUI Themeroller (opsional)

  • Mendukung semua jQuery dan jQueryUI show / hide effects (opsional)

  • Mendukung semua jQueryUI / ikon kustom

  • Termasuk dukungan ARIA (Aplikasi Internet Rich Richable)

  • Dukungan pencarian keyboard dan navigasi penuh

  • API peristiwa yang dipicu pada elemen kotak pilihan asli yang memanggil plugin

  • Metode API menyediakan metode untuk berinteraksi dengan daftar dropdown (yaitu, Cari, Buka, Nonaktifkan, Atur Opsi).

  • Melewati jsHint tanpa kesalahan

  • Dukungan Terpilih, Dinonaktifkan, dan Optgroup

  • Mudah diperluas untuk memungkinkan pengembang membuat widget baru


1
2018-05-03 21:24