Apa nilai yang tepat untuk atribut yang dicentang dari kotak centang HTML?

Kita semua tahu cara membentuk input kotak centang dalam HTML:

<input name="checkbox_name" id="checkbox_id" type="checkbox">

Apa yang saya tidak tahu - berapa nilai teknis yang benar untuk kotak centang yang dicentang? Saya telah melihat ini semua bekerja:

<input name="checkbox_name" id="checkbox_id" type="checkbox" checked>
    <input name="checkbox_name" id="checkbox_id" type="checkbox" checked="on">
    <input name="checkbox_name" id="checkbox_id" type="checkbox" checked="yes">
    <input name="checkbox_name" id="checkbox_id" type="checkbox" checked="checked">
    <input name="checkbox_name" id="checkbox_id" type="checkbox" checked="true">

Apakah jawaban itu tidak masalah? Saya tidak melihat bukti untuk jawaban yang ditandai benar di sini dari spesifikasi itu sendiri:

Kotak centang (dan tombol radio) adalah sakelar hidup / mati yang dapat diaktifkan oleh pengguna. Sakelar "aktif" saat atribut yang dicentang elemen kontrol diatur. Saat formulir dikirimkan, hanya kontrol centang "on" yang bisa berhasil. Beberapa kotak centang dalam formulir dapat berbagi nama kontrol yang sama. Jadi, misalnya, kotak centang memungkinkan pengguna untuk memilih beberapa nilai untuk properti yang sama. Elemen INPUT digunakan untuk membuat kontrol kotak centang.

Apa yang akan dikatakan oleh penulis spec adalah jawaban yang benar? Harap berikan jawaban berbasis bukti.

Sebenarnya, Anda harus meletakkan sesuatu yang masuk akal - menurut spesifikasi di sini , versi yang paling benar adalah:

<input name=name id=id type=checkbox checked=checked>

Untuk HTML, Anda juga dapat menggunakan sintaks atribut kosong , checked=""atau bahkan hanya checked(untuk XHTML ketat, ini tidak didukung ).

Namun, secara efektif, sebagian besar browser akan mendukung hampir semua nilai di antara kutipan. Semua hal berikut akan diperiksa:

<input name=name id=id type=checkbox checked>
<input name=name id=id type=checkbox checked="">
<input name=name id=id type=checkbox checked="yes">
<input name=name id=id type=checkbox checked="blue">
<input name=name id=id type=checkbox checked="false">

Dan hanya yang berikut ini yang tidak dicentang:

<input name=name id=id type=checkbox>

Lihat juga pertanyaan serupa ini di disabled="disabled".

Spesifikasi HTML5 :

http://www.w3.org/TR/html5/forms.html#attr-input-checked :

Atribut konten yang dinonaktifkan adalah atribut boolean.

http://www.w3.org/TR/html5/infrastructure.html#boolean-attributes :

Kehadiran atribut boolean pada elemen mewakili nilai sebenarnya, dan tidak adanya atribut mewakili nilai palsu.

Jika atribut ada, nilainya harus berupa string kosong atau nilai yang merupakan kecocokan tidak peka huruf ASCII untuk nama kanonik atribut, tanpa spasi spasi awalan atau jejak.

Kesimpulan :

Berikut ini adalah valid, setara, dan benar :

<input type="checkbox" checked />
<input type="checkbox" checked="" />
<input type="checkbox" checked="checked" />
<input type="checkbox" checked="ChEcKeD" />

Berikut ini tidak valid :

<input type="checkbox" checked="0" />
<input type="checkbox" checked="1" />
<input type="checkbox" checked="false" />
<input type="checkbox" checked="true" />

Tidak adanya atribut adalah satu-satunya sintaks yang valid untuk false :

<input />

Rekomendasi

Jika Anda peduli untuk menulis XHTML yang valid, gunakan checked="checked", karena <input checked>XHTML tidak valid (tetapi HTML yang valid) dan alternatif lain kurang dapat dibaca. Lain, gunakan saja <input checked>karena lebih pendek.

<input ... checked />
<input ... checked="checked" />

Itu sama-sama valid. Dan dalam JavaScript:

input.checked = true;
input.setAttribute("checked");
input.setAttribute("checked","checked");

Anda ingin ini saya pikir: checked='checked'

1. diperiksa
2. checked = ""

3. diperiksa = "diperiksa"

   adalah setara;

menurut spec checkbox '---- ⓘ checked = "checked" atau "" (string kosong) atau kosong Menentukan bahwa elemen tersebut mewakili kontrol yang dipilih .---'

Ini kota yang cukup gila bahwa satu-satunya cara untuk membuat false diperiksa adalah dengan menghilangkan nilai apa pun. Dengan Angular 1.x, Anda dapat melakukan ini:

  <input type="radio" ng-checked="false">

yang jauh lebih waras, jika Anda perlu membuatnya tidak dicentang.

Saya pikir ini dapat membantu:

Kedua, Anda perlu menyadari bahwa atribut yang diperiksa MENGEMBALIKAN string "benar", "salah".
Mengapa ini penting? Karena Anda perlu menggunakan Jenis yang benar. Sebuah string, bukan boolean. Ini juga penting saat menguraikan kotak centang Anda.
$('mycheckbox')[0].checked = "true"

if($('mycheckbox')[0].checked === "true"){ //do something }

Anda juga perlu menyadari bahwa ATTRIBUTE "dicentang" adalah untuk menetapkan nilai kotak centang pada awalnya. Ini tidak banyak berfungsi setelah elemen diberikan ke DOM. Bayangkan ini berfungsi saat laman web dimuat dan awalnya diuraikan.
Saya akan pergi dengan preferensi IE yang satu ini:<input type="checkbox" checked="checked"/>

Terakhir, aspek utama kebingungan untuk kotak centang adalah bahwa elemen UI kotak centang tidak sama dengan nilai properti elemen. Mereka tidak berkorelasi langsung. Jika Anda bekerja di .net, Anda akan menemukan bahwa pengguna "memeriksa" kotak centang tidak pernah mencerminkan nilai bool yang sebenarnya diteruskan ke controller. Untuk mengatur UI, saya menggunakan keduanya $('mycheckbox').val(true);dan$('mycheckbox').attr('checked', 'checked');

Nah, untuk menggunakannya saya tidak berpikir masalah (mirip dengan dinonaktifkan dan hanya baca), secara pribadi saya menggunakan centang = "diperiksa" tetapi jika Anda mencoba untuk memanipulasi mereka dengan JavaScript, Anda menggunakan true / false