當前位置:編程學習大全網 - 行動軟體 - 什麽是復選框

什麽是復選框

Javascript基礎教程

第七頁:復選框( 728 )

文字域和文字區域是表單的兩種元素。其它的還有復選框、單選框及下拉菜單。首先我們學習復選框。

復選框的主要屬性就是:被選中(checked)。

This checkbox is checked

This checkbox is not checked

如果有壹個名為the_form的表單,其中壹個復選框的名稱為the_checkbox,妳可壹看到如果點擊該復選框會發生什麽情況:

var is_checked =

window.document.the_form.

the_checkbox.checked;

if (is_checked == true)

{

alert("Yup, it's checked!");

} else {

alert("Nope, it's not checked.");

}

如果復選框被選中,則復選框的屬性為真(true)。

真(true)是JavaScript內置的數據類型,所以妳不必 對true添加引號。如果復選框未被選中,則其屬性為 假(false),這也是壹只內置數據類型。

妳還可以設定復選框的屬性。以下是設置復選框屬性的壹個例子:

Checkbox 1

Click to check Checkbox 1

Click to uncheck Checkbox 1

Click to see the value of Checkbox 1

以下為代碼:

<form name="form_1">

<input type="checkbox" name="check_1">

Checkbox 1

</form>

<a href="#"

onClick=

"window.document.form_1.check_1.

checked=true; return false;">

Click to check Checkbox 1</a>

<a href="#"

onClick=

"window.document.form_1.check_1.

checked=false; return false;">

Click to uncheck Checkbox 1</a>

<a href="#"

onClick="alert(window.document.

form_1.check_1.checked); return false;">

Click to see the value of Checkbox 1</a>

註意我在鏈接中始終加入了return false,以防止瀏覽器刷新頁面又回到原來的內容。

復選框的事件處理器是onClick。當某人點擊復選框

時,onClick事件處理器即發揮作用。以下為其使用實例。

The Light Switch

該例子中,表單應用了onClick復選框處理器:

<form name="form_2">

<input type="checkbox" name ="check_1"

onClick="switchLight();">The Light Switch

</form>

當某人點擊復選框時,onClick處理器被激活並執行函

數switchLight(),以下為函數switchLight() 的編碼(它置於網頁首部中):

function switchLight()

{

var the_box = window.document.form_2.check_1;

var the_switch = "";

if (the_box.checked == false) {

alert("Hey! Turn that back on!");

document.bgColor='black';

} else {

alert("Thanks!");

document.bgColor='white';

}

}

第壹行:

var the_box = window.document.form_2.check_1;

將復選框對象賦值給壹個變量。這樣可以縮小編程長度,還可以將對象作為參數傳遞給函數。

  • 上一篇:電腦開機前兩層密碼保護怎麽設置
  • 下一篇:跪求~~~我看過壹個太空喜劇電影,
  • copyright 2024編程學習大全網