Kotak pilihan tersuai halaman web Select_HTML/Xhtml_pengeluaran halaman web

Semua orang mungkin biasa dengan borang senarai juntai bawah pilih, tetapi borang senarai juntai bawah lalai sering membuatkan sesetengah tapak web berasa jelek, dan juga sukar untuk melaraskan gaya pilih menggunakan CSS. Oleh itu, banyak tapak web sering menggunakan JS untuk mensimulasikan kesan ini untuk membuat borang drop-down pilihan yang lebih sesuai dengan gaya laman web.

Sebagai contoh, Tudou, Taobao Mall dan Amazon, yang kami sangat kenali, semuanya menggunakan JS untuk membuat borang senarai lungsur.

Hasil ini jelas bersatu secara visual dengan gaya keseluruhan tapak web, dan gaya senarai juntai bawah sangat cantik, tetapi ia juga membawa beberapa reaksi buruk Kerana ia dilakukan dengan JS, anda akan menghadapi banyak perkara yang tidak dijangka kesan , mari analisa kelemahan masing-masing satu demi satu melalui tiga tapak web penguji:

Kotak pilihan kategori carian
Kentang membuat saya berasa pelik setiap kali saya mengkliknya:

1. Selepas mengklik, kedudukan senarai pop timbul adalah berbeza daripada yang dijangkakan. Secara tidak sedar ia adalah senarai drop-down, tetapi Tudou memberikan saya "senarai drop-down".
2. Saya lazimnya menggunakan kekunci atas/bawah untuk memilih, tetapi keseluruhan halaman menatal.
3. Dalam keadaan marah, saya mahu menutupnya. Menekan kekunci ESC, tiada apa yang berlaku.

4. Selepas melumpuhkan JS, ia tidak boleh digunakan sepenuhnya.

Begitu juga, Taobao Mall
juga kelihatan cantik:

Kecuali titik 1, semua yang lain adalah sama seperti Kentang, dengan isu kebolehcapaian dan kebolehgunaan.

Penyelesaiannya sangat mudah, hanya gunakan kotak pilihan asli, seperti Amazon
:

Mengapa kami tidak digalakkan menggunakan kotak pilihan tersuai dalam halaman web?

Kotak pilihan pilihan ialah kawalan interaktif yang sangat matang. Kematangan bermakna pengguna mudah diterima, tetapi kematangan juga bermakna semua jenis pengguna dipertimbangkan dengan teliti dan mempunyai butiran interaksi yang sangat kaya. Contohnya: respons kepada operasi papan kekunci seperti PgUp/PgDn, Home/End, dsb., dan keupayaan untuk melaraskan arah pop timbul senarai juntai bawah secara automatik dalam kedudukan berbeza, dsb.

Menggunakan JS untuk mensimulasikan kotak pilihan memerlukan banyak kerja dan ujian yang teliti. Walaupun syarikat itu bersedia untuk melabur, ia masih tidak dapat melaksanakan beberapa ciri kawalan asli. Sebagai contoh: dalam kotak pilihan Amazon di atas, saya menarik penyemak imbas dengan sangat rendah, dan kemudian senarai juntai bawah boleh keluar dari penyemak imbas.

Demi sedikit "pencuci mulut visual", begitu banyak butiran praktikal hilang dalam interaksi, dan banyak masa pengaturcara bahagian hadapan terpaksa dihabiskan.

PS: Untuk menggunakan kotak pilihan tersuai, syarat berikut mesti dipenuhi:

1. Segila Google dan sanggup menghabiskan banyak masa dan sumber.
2. Berhati-hati seperti Google Jika anda mahu melakukannya, lakukannya dengan baik.

3. Mohon pada apl web.

Malangnya, di China, syarikat yang gila dan teliti seperti Google atau Facebook masih belum muncul.