checkbox的三種狀態處理

checkbox只有兩種值：選中（checked）或未選中（unchecked）。它可以有任何值，但是表單提交時checkbox的值只能是checked或unchecked。它的默認值是unchecked，你可以在HTML中這樣控制它：

<!-- Default to unchecked -->
<input type="checkbox">

<!-- Default to checked, XHTML -->
<input type="checkbox" checked="checked" />

<!-- Default to checked, HTML5 -->
<input type="checkbox" checked>

視覺上，checkbox有三種狀態：checked、unchecked、indeterminate（不確定的）。看起來就像這樣子：

對於indeterminate狀態的checkbox需要注意的是：你無法在HTML中設置checkbox的狀態為indeterminate。因為HTML中沒有indeterminate這個屬性，你可以通過Javascript腳本來設置它

var checkbox = document.getElementById("reyo-checkbox");
checkbox.indeterminate = true;

 或者通過jQuery來設置

$("#reyo-checkbox").prop("indeterminate", true); // prop is jQuery 1.6+

$("#reyo-checkbox").attr("indeterminate", true);
$("#reyo-checkbox").prop("indeterminate", true);
兩種都可以，不過新版jquery推薦第二種，兩個在其他方面都差不多，我發現的唯一不同就是在checkbox上的時候，需要用prop，不然IE瀏覽器會不兼容

 checkbox的indeterminate狀態僅僅是視覺上的，它的值仍然只有checked或unchecked，這意味着indeterminate狀態的checkbox的真正價值只是在用戶界面上看起來更友好！來看一下我們實際應用的效果：