Javascript - input(checkbox)物件
| 名稱 | 類形 | 說明 |
|---|---|---|
| checkbox | 屬性 | 在Javascript中check物件即代表<form>標籤裡的<input type="radio" />,它是一組供使用者以勾選的方式輸入資訊的物件,可以在一組擁有相同name屬性值的checkbox群組裡做選取,和radio不同,checkbox可以複選;每一項都有布林值checked屬性,被選中為true,沒有被選中則為false。 |
| accessKey | 屬性 | String value that sets/ returns the accessKey for the checkbox. |
| checked | 屬性 | 偵測或設置checkbox的選取狀態,使用布林值控制,被選中的項目會被設置為true,未選中的則為false。 範例1,控制checkbox的選取狀態:
<form>
選擇您的興趣:
<div><input type="checkbox" name="hobby" id="tv" /><label for="tv">看電視</label></div>
<div><input type="checkbox" name="hobby" id="ball" /><label for="ball">打球</label></div>
<div><input type="checkbox" name="hobby" id="web" /><label for="web">上網</label></div>
<div><input type="checkbox" name="hobby" id="literature" /><label for="literature">看書</label></div>
<div><input type="checkbox" name="hobby" id="travel" /><label for="travel">旅遊</label></div>
<div><input type="checkbox" name="hobby" id="music" /><label for="music">聽音樂</label></div>
<div>
<input type="button" value="全選" />
<input type="button" value="全不選" />
<input type="button" value="反選" />
</div>
</form>
<script>
var hobbies = document.forms[0].hobby;
var lastDiv = document.getElementsByTagName('div')[6];
var selectAll = lastDiv.getElementsByTagName('input')[0];
var selectNone = lastDiv.getElementsByTagName('input')[1];
var selectReverse = lastDiv.getElementsByTagName('input')[2];
function changeSelection(a){
for(var i=0;i<hobbies.length;i++){
if(a<0){
hobbies[i].checked = !hobbies[i].checked;
}
else{
hobbies[i].checked = a;
}
}
}
selectAll.onclick = function(){changeSelection(1);}
selectNone.onclick = function(){changeSelection(0);}
selectReverse.onclick = function(){changeSelection(-1);}
</script>
Boolean property that reflects the current state of the checkbox, "true" if it's checked, and "false" if not.Example(s):
<form name="test">
<input type="checkbox" name="checkgroup" checked />
<input type="checkbox" name="checkgroup" />
<input type="checkbox" name="checkgroup" checked />
</form>
<script type="text/javascript">
for (i=0; i<document.test.checkgroup.length; i++){
if (document.test.checkgroup[i].checked==true)
alert("Checkbox at index "+i+" is checked!")
}
</script>
|
| defaultChecked | 屬性 | 如果初始時是選中的則傳回true Boolean property that reflects the value of the CHECKED attribute. |
| disabled | 屬性 | Boolean value that sets/ returns whether the checkbox is disabled. |
| form | 屬性 | 指向表單元素所在的<form> References the form that contains the checkbox. |
| name | 屬性 | 讀取/設定表單元素name屬性的值 Sets or returns the value of the name attribute of a form element. |
| type | 屬性 | 設定/讀取表單元素type屬性的值;IE8(含)以下的瀏覽器只能讀取,不支援設定屬性的功能。 A property available on all form elements, "type" returns the type of the calling form element, in this case, "checkbox". |
| value | 屬性 | 存/取表單元素value屬性的值 A read/write string that specifies the value of the checkbox (the value attribute). |
| onBlur | 事件屬性 | Code is executed when the focus is removed from the checkbox. |
| onClick | 事件屬性 | Code is executed when user clicks on the checkbox. |
| onFocus | 事件屬性 | Code is executed when the focus is set on the checkbox. |
| blur() | 方法 | 使焦點離開某個元素 Removes focus away from the checkbox. |
| click() | 方法 | 模擬使用者按一下該元素 Simulates a user clicking on the checkbox. |
| focus | 方法 | 聚焦到某個元素上 Sets focus on the checkbox. |