What Is a Check Box?

The check box is a basic control that can select multiple items at the same time. It is also a programming code framework based on computer languages (C, Java, CSS + HTML Hypertext Markup Language). The general control method is to hold the ctrl key, and Click the left mouse button to perform a click operation to complete multiple targets selection.

Checkbox

name of software: Checkbox
nickname: CheckBox

Nature: basis

Achieve checkbox selection and deselection

Solutions:

Implementation of select all: Iterate over all check boxes, and then set the checked property of each multi-option to true. Implementation of anti-selection: Iterate through all check boxes and get the checked property value of the check box. If it is true, set it to false, otherwise set it to true, which is the opposite setting of the current value.

Specific steps:

Code example:

function selectit () {

// Set the value of variable form to a form whose name is equal to select

var form = document.select

// Get the name attribute value of the button that triggered the event

var action = event.

for (var i = 0; i <form.elements.length; i ++) {// traverse form items

// abbreviate the current form item form.elements object as e

var e = form.elements

// If the name attribute value of the current form item is iTo,

// Execute the next line of code. Limit the scope of form items processed by the script.

if (e.name == "iTo")

/ * If the click event occurs on a button whose name is selectall, set the checked property of the current form item to true (that is, selected), otherwise set it to the opposite value of the current setting (inverted selection) * /

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

}

</ script>

<INPUT type = "checkbox" name = "selectall" onclick = "selectit ()"> Select all

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

<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>

Note: The checkboxes that can be selected all or deselected in this example must be set to name iTo.

Tip: In this example, instead of iterating through each element of the form, you only need to iterate through the getElementsByName ("iTo") collection.

Special Note

After the code runs, select the "Select All" check box. All the check boxes with the name iTo will be selected. The effect is shown in Figure 1.4.12.

Figure 1.4.12 Select All Checkbox

Special Note

What you need to know in this example is the traversal of the form items and the setting or obtaining of the checked or unchecked state of the check box.

checked Sets or retrieves the state of the check box or radio button, true is checked, false is not checked.

elements Gets a collection of all the controls in the specified form in source order (excluding image type control objects).

Select all, unselect all, and deselect all check boxes

<html>

<head>

<title> Web page special effect code-check box check all, check all and reverse selection effect implementation </ title>

<!-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>

<br>

</ form>

</ body>

</ html>

What Is a Check Box?

Checkbox

IN OTHER LANGUAGES

RELATED ARTICLES

How can we help?