複選框

複選框

複選框是一種可同時選中多項的基礎控制項,也是基於計算機語言(C語言、java語言、CSS+HTML超文本標記語言)的編程代碼框架,一般控制的方法是按住ctrl鍵,然後滑鼠左擊進行點選操作來完成複選多個目標。

基本信息

內容介紹

控制項

複選框,也叫做CheckBox,是一種基礎控制項。.NET的工具箱裡包含這個控制項,它可以通過其屬性和方法完成複選的操作。為了完成更多複雜的需求,也出了第三方控制項的複選框。只需要將其dll添加到工具箱裡,就可以使用更多功能的複選框控制項。

java的複選框

複選框提供一個製造單一選擇開關的方法;它包括一個小框和一個標籤。典型的複選框有一個小的“X”(或者它設定的其它類型)或是空的,這依靠項目是否被選擇來決定的。

我們會使用構建器正常地創建一個複選框,使用它的標籤來充當它的自變數。如果我們在創建複選框後想讀出或改變它,我們能夠獲取和設定它的狀態,同樣也能獲取和設定它的標籤。注意,複選框的大寫是與其它的控制相矛盾的。

無論何時一個複選框都可以設定和清除一個事件指令,我們可以捕捉同樣的方法做一個按鈕。在下面的例子裡使用一個文字區域枚舉所有被選中的複選框:

//: CheckBox1.javafdf

// Using check boxes

import java.awt.*;

import java.applet.*;

public class CheckBox1 extends Applet {

TextArea t = new TextArea(6, 20);

Checkbox cb1 = new Checkbox("Check Box 1");

Checkbox cb2 = new Checkbox("Check Box 2");

Checkbox cb3 = new Checkbox("Check Box 3");

public void init() {

add(t); add(cb1); add(cb2); add(cb3);

}

public boolean action (Event evt, Object arg) {

if(evt.target.equals(cb1))

trace("1", cb1.getState());awd

else if(evt.target.equals(cb2))

trace("2", cb2.getState());

else if(evt.target.equals(cb3))

trace("3", cb3.getState());

else

return super.action(evt, arg);

returntrue;

}

void trace(String b, boolean state) {

if(state)

t.appendText("Box " + b + " Set\n");

else

t.appendText("Box " + b + " Cleared\n");

}awd} ///:~

trace()方法將選中的複選框名和當前狀態用appendText()傳送到文字區域中去,所以我們看到一個累積的被選中的複選框和它們的狀態的列表。

建立

在word中

點Word“視圖”選單,在“工具列”項中點“控制項工具箱”(在office2010中,選擇“檔案”→“選項”→“自定義功能區”→勾選右側 “開發工具 ”→確定,之後頂上的標籤選單會出現一個 開發工具),會在Word視窗的編輯區左側出現一個新的工具條,這就是“控制項工具箱”,其中有一個按鈕是內部有小對勾的方框,用滑鼠指向時會出現“複選框”的提示。

點“複選框”按鈕,會在Word頁面上出現一個叫標有“CheckBox1”的小方框,即“第1複選框”,前面的小方框就是複選框,底紋是灰色,點“控制項工具箱”的第一個按鈕“退出設計模式”就可以在內部打對勾的,也可以取消對勾。再點“複選框”按鈕,會在頁面上再出現一個“複選框”標籤,叫“CheckBox2”,即“第2複選框”。往下依次類推。

在這些標籤上僅僅顯示“CheckBox1”和“CheckBox2”肯定是不能滿足要求的,要修改這些標籤內容。底紋要變為白色,要和文字融為一體。

按下“控制項工具箱”第一個按鈕,使它處於“設計模式”,點中一個“複選框”,四周會出現八個小圓圈,處於選中狀態,點“控制項工具箱”第二個按鈕,在左側出現一個“屬性”對話框,點“BackColor”項,這是設定背景顏色的,右邊的單元格中出現個下拉三角,點擊,選中合適的顏色。點“Caption”項,當單元格為藍色時,右側的單元格就可以編輯了,輸入你需要的文字,WORD的正文中立即就變成了你輸入的文字。點“控制項工具箱”的第一個按鈕“退出設計模式”,試試效果。

在Excel中

窗體工具條控制項介紹

“複選框”控制項。可選中一個或同時選中多個複選框,以打開或者關閉某選項。其值確定複選框的狀態,即該複選框是處於未選擇、已選擇或混合狀態;單元格連結即是返回複選框狀態值的單元格,若選中複選框,則與其相連結的單元格值為True;若未選擇複選框,則與其相連結的單元格值為False;若複選框處於混合狀態,則與其相連結的單元格值為#N/A;若與其相連結的單元格為空,則Excel認為複選框狀態為False。選中3D陰影將以三維陰影效果顯示複選框。

效果實現

實現複選框的全選和反選

解決思路:

全選的實現:遍歷所有複選框,然後設定各多選項的checked屬性為true。反選的實現:遍歷所有複選框,獲取複選框的checked屬性值,是true的話則設定為false,否則設為true,即作當前值的相反設定。

具體步驟:

代碼示例:

<script>

function selectit(){

//設定變數form的值為name等於select的表單

var form=document.select

//取得觸發事件的按鈕的name屬性值

var action=event.

for (var i=0;i<form.elements.length;i++){//遍歷表單項

//將當前表單項form.elements對象簡寫為e

var e = form.elements

//如果當前表單項的name屬性值為iTo,

//執行下一行代碼。限定腳本處理的表單項範圍。

if (e.name == "iTo")

/*如果單擊事件發生在name為selectall的按鈕上,就將當前表單項的checked屬性設為true(即選中),否則設定為當前設定的相反值(反選)*/

e.checked =(action=="selectall")?(form.selectall.checked):(!e.checked)

}

}

</script>

<form name="select">

<INPUT type="checkbox" name="selectall" onclick="selectit()">全選

<INPUT type="checkbox" name="Inverse" onclick="selectit()">反選

<INPUT type="checkbox" name="iTo" value="1">1

<INPUT type="checkbox" name="iTo" value="2">2

<INPUT type="checkbox" name="iTo" value="3">3

<INPUT type="checkbox" name="iTo" value="4">4

<INPUT type="checkbox" name="iTo" value="5">5

</form>

注意:本例中能被全選或反選的複選框必須設定name為iTo。

技巧:在本例中其實不用遍歷表單的每個元素,只需要遍歷getElementsByName("iTo")集合就行了。

特別提示

代碼運行後,選中”全選”複選框,所有name為iTo的複選框將被選中,效果如圖1.4.12所示。

圖1.4.12全選複選框

特別說明

本例需要掌握的內容是對表單項的遍歷和複選框的選中或不選中狀態的設定或獲取。

checked 設定或獲取複選框或單選鈕的狀態,true為選中,false為不選中。

elements 獲取以源順序排列的指定表單中所有控制項的集合(不包括圖像類型的控制項對象)。

複選框全選、全不選和反選效果

<html>

<head>

<meta http-equiv="Content-Type" content="text/html; charset=gb2312">

<title>網頁特效代碼--複選框全選、全不選和反選的效果實現</title>

<SCRIPT LANGUAGE="JavaScript">

<!-- Begin

function checkAll() {

for (var j = 1; j <= 9; j++) {

box = eval("document.checkboxform.C" + j);

if (box.checked ==false) box.checked =true;

}

}

function uncheckAll() {

for (var j = 1; j <= 9; j++) {

box = eval("document.checkboxform.C" + j);

if (box.checked ==true) box.checked =false;

}

}

function switchAll() {

for (var j = 1; j <= 9; j++) {

box = eval("document.checkboxform.C" + j);

box.checked = !box.checked;

}

}

// End -->

</script>

</head>

<body>

<form name=checkboxform>

<input type=checkbox name=C1 checked>C1<br>

<input type=checkbox name=C2 checked>C2<br>

<input type=checkbox name=C3 checked>C3<br>

<input type=checkbox name=C4 checked>C4<br>

<input type=checkbox name=C5 checked>C5<br>

<input type=checkbox name=C6 checked>C6<br>

<input type=checkbox name=C7 checked>C7<br>

<input type=checkbox name=C8 checked>C8<br>

<input type=checkbox name=C9 checked>C9<br>

<br>

<input type=button value="全部選中" onClick="checkAll()"><br>

<input type=button value="全部不選" onClick="uncheckAll()"><br>

<input type=button value="選擇轉換" onClick="switchAll()"><br>

</form>

</body>

</html>

相關詞條

相關搜尋

熱門詞條

聯絡我們