Creates a check box control.
HTML Syntax
<INPUT ACCESSKEY = key ALIGN = LEFT | CENTER | RIGHT ALT = text CHECKED CLASS = classname DISABLED ID = value LANG = language LANGUAGE = JAVASCRIPT | JSCRIPT | VBSCRIPT | VBS LOWSRC = url MAXLENGTH = n NAME = name READONLY SIZE = n STYLE = css1-properties TABINDEX =n TITLE =text TYPE = CHECKBOX VALUE = value event = script >
Remarks
When a checkbox element is selected, a name/value pair is submitted with the FORM. The default value of checkbox is on.
The height and width styles are exposed to the checkbox element as of Microsoft® Internet Explorer 5. The size of the element is set based on the values provided by the author, except when a given size is below a particular minimum. The size is calculated as follows:
- If the height or width is greater than 20 pixels, the padding around the check box is set to 4 pixels, and the inner height or width is set to 8 pixels.
- If the height or width is less than 20 pixels but greater than 13 pixels, the padding around the check box is equal to one half the specified height or width minus 13. For example, if the specified width of the check box is 17, the equation would be: (17-13)/2.
- If the height or width is less than 12 pixels, the padding around the check box is set to 0 and the inner width is set to the value specified by the author.
The checkbox element is an inline element and does not require a closing tag.
This element is available in HTML and script as of Internet Explorer 3.0.
Members
Styles
Example
This example uses the checkbox element to create two check boxes with explanatory text. The onclick events call two script functions. The first check box is checked.
Sample Code
<INPUT TYPE=checkbox CHECKED ID=chk1 onclick="choosebox1()">Uncheck this check box for some free advice. <P><INPUT TYPE=checkbox ID=chk2 onclick="choosebox2()">Or check this check box for a message from our sponsors. <P ID=SampText>This example implements the script when the user clicks either check box.
<SCRIPT> function choosebox1(){ alert("Never play leapfrog with a unicorn!") } function choosebox2(){ SampText.insertAdjacentHTML("AfterBegin","Buy WonderWidgets! "); } </SCRIPT>The preceding HTML code and script examples create and implement the following check boxes:
Uncheck this check box for some free advice.Or check this check box for a message from our sponsors.
See Also