Cú pháp cho các thuộc tính boolean là gì, ví dụ: một hộp kiểm được chọn, trong HTML?

Question

Âm thanh như một câu hỏi ngớ ngẩn, nhưng tôi tự hỏi cách tốt nhất để nói rằng hộp kiểm được chọn/bỏ chọn trong HTML là gì.

Tôi đã thấy rất nhiều ví dụ khác nhau:

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

<input type="checkbox" checked="yes" /> 
<input type="checkbox" checked="no" /> 

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

Những trình duyệt làm việc với những người thân mà trong số này, và quan trọng nhất, không jQuery tìm ra hộp được kiểm tra ở cả 3?

Chỉnh sửa: Thông số W3C dường như ngụ ý rằng chỉ cần kiểm tra attr là có chính xác. Điều đó có nghĩa là checked = "false" và checked = "no" vẫn sẽ kiểm tra hộp không?

Answer 1

Trong HTML:

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

Đối với XHTML bạn phải sử dụng thuộc tính/giá trị cặp kết hợp:

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

Answer 2

HTML:

Bất kỳ trong số họ sẽ là một trong những quyền như họ nói về W3C page. Thuộc tính checked chỉ cần được đặt.

Như tôi đã viết trong Coronatus' bình luận:

Trong thực tế, nó không quan trọng nếu nó kiểm tra, kiểm tra = 'bất cứ điều gì' hay kiểm tra = 'kiểm tra'. Đó là kiểm tra giá trị boolean, do đó, hoặc là đúng (bộ) hoặc sai (không được đặt).

XHTML:

Bạn cần phải xác định nó, vì vậy checked="checked" là người duy nhất có giá trị. Hầu hết các trình duyệt có thể sẽ phân tích cú pháp các giá trị HTML chính xác, nhưng bạn sẽ gặp lỗi trên trang của bạn.

Answer 3

Theo W3C recommendations đề xuất đầu tiên của bạn là chính xác.

Answer 4

Sự hiện diện của thuộc tính "đã chọn" chỉ định trạng thái. Giá trị không liên quan/không cần thiết.

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

là đề nghị của tôi

Answer 5

Theo HTML spec, đúng một là:

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

Tôi sử dụng công cụ này và jQuery hoạt động hoàn hảo với chúng.

Answer 6

Một thử nghiệm nhanh cho thấy rằng jQuery tương đương với bất kỳ giá trị nào được đặt để được kiểm tra.

alert($('input:checked').length); 
// Returns 5 

Ngay cả chuỗi trống và giá trị âm.

Answer 7

Tôi sẽ cẩn thận khi sử dụng nó trên chrome, firefox và opera. Chorme dường như có vấn đề với các hộp kiểm hiển thị, Firefox phân biệt chữ hoa và chữ thường, và opera dường như chạy tốt nhưng chậm khi cập nhật. Có thể chỉ là phiên bản của các trình duyệt đang được sử dụng.

Khác với tôi tin rằng nó sẽ chạy <input type="checkbox" checked /> tốt trong tất cả chúng. Sự khác biệt duy nhất thực sự là cách các trình duyệt riêng lẻ xuất hiện để hiển thị nội dung trên trang.

Answer 8

Thông số W3C dường như ngụ ý rằng chỉ cần kiểm tra attr là có chính xác. Điều đó có nghĩa là checked = "false" và checked = "no" vẫn sẽ kiểm tra hộp không?

Chính xác. Đó là lý do tại sao bạn nên sử dụng checked="true" và checked="yes", chúng ngụ ý rằng checked="false" và checked="no" sẽ không chọn hộp này.

Answer 9

HTML5 đặc tả:

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

Sự hiện diện của một thuộc tính boolean trên một yếu tố đại diện cho giá trị thực sự, và sự vắng mặt của thuộc tính đại diện cho giá trị sai.

Nếu thuộc tính có mặt, giá trị của nó phải là chuỗi rỗng hoặc giá trị là một đối sánh không phân biệt chữ hoa chữ thường ASCII cho tên chuẩn của thuộc tính, không có khoảng trắng đầu hoặc cuối.

Kết luận:

Hãy boolean là một thuộc tính boolean của thẻ tag, như checked và <input type="checkbox".

Sau đây là hợp lệ, tương đương và đúng:

<tag boolean /> 
<tag boolean="" /> 
<tag boolean="boolean" /> 
<tag boolean="BoOlEaN" /> 

Sau đây là không hợp lệ:

<tag boolean="0" /> 
<tag boolean="1" /> 
<tag boolean="false" /> 
<tag boolean="true" /> 

Sự vắng mặt của các thuộc tính là cú pháp hợp lệ chỉ cho sai :

<tag /> 

Khuyến nghị

Nếu bạn quan tâm về cách viết XHTML hợp lệ, sử dụng boolean="boolean", vì <tag boolean> là XHTML hợp lệ (nhưng HTML hợp lệ) và lựa chọn thay thế khác ít có thể đọc được. Khác, chỉ cần sử dụng <tag boolean> vì nó ngắn hơn.