Pertanyaan Membuat kotak centang dan label radio dapat diklik


Sejumlah besar situs (berani saya katakan paling?) Tidak membuat label dapat diklik untuk kotak centang dan input radio mereka. Tampaknya menjadi keuntungan kegunaan yang besar untuk sedikit usaha. Apakah ada masalah kompatibilitas / fungsi / kegunaan dengan menggunakan <label> yang akan mencegah pengembang menggunakan tag ini?

Edit: Bahkan StackOverflow tampaknya bersalah dalam hal ini, misalnya ketika mengajukan pertanyaan, Beri tahu setiap hari tentang jawaban baru apa pun label kotak centang tidak dapat diklik.


32
2018-02-13 13:08


asal


Jawaban:


Tidak ada alasan lain selain kemalasan. <label>Ini sangat penting untuk aksesibilitas, dan juga sangat berguna bagi kita yang memiliki tujuan yang buruk dengan klik mouse kami :)


30
2018-02-13 13:14



Tidak, tidak ada masalah dengan itu, tapi sayangnya ini satu dari tag html yang paling diabaikan. Setuju, tag ini sangat penting untuk alasan aksesibilitas dan apa lagi ketika datang ke tata letak untuk perangkat kecil seperti ponsel, Anda tidak dapat hidup tanpa ini.


7
2018-02-13 13:20



Satu-satunya kesulitan yang dapat saya pikirkan adalah bahwa kontrol formulir Anda harus memiliki atribut ID, dan atribut ID harus unik dalam halaman Anda.

Jika Anda membuat bidang formulir secara terprogram, Anda harus membuat ID unik untuk masing-masing dari mereka dalam setiap halaman tempat mereka muncul. Ini bisa dibayangkan menjadi masalah.

Tetapi umumnya, ya, saya pikir hanya programmer yang tidak memilikinya di kepala mereka.

Di ASP.NET WebForms (atau apa pun namanya), Anda menginginkan AssociatedControlID atribut pada <asp:Label> elemen.


3
2018-02-13 14:12



Dan inilah a demonstrasi bagi mereka yang mencari cara melakukannya.

Ada cara untuk menghubungkan teks dekat elemen formulir dengan elemen itu sendiri, jadi salah satu dapat diklik untuk mengaktifkan kontrol:

apa yang akan kamu suka dengan minumanmu?

<label for="ice1"><input type="checkbox" name="withice" id="ice1">ice</label> 
<label for="ice2"><input type="checkbox" name="withlid" id="ice2">plastic lid</label>
<label for="ice3"><input type="checkbox" name="withstraw" id="ice3">straw</label>

3
2018-05-24 21:08



<label> adalah tag HTML murni, tidak diperlukan JavaScript. Saya kira semua browser (utama) mendukung tag ini, karena sangat mudah diterapkan.

Banyak pengembang tidak menggunakannya karena:

  • itu membutuhkan lebih banyak upaya (menambahkan semua tag di mana-mana)
  • mereka tidak tahu keberadaannya
  • mereka pikir itu tidak nyaman ?!

Tetapi tidak ada alasan untuk tidak menggunakan tag. Kecuali kamu sangat terbatas dengan bandwidth Anda, mungkin?


1
2018-02-13 13:15