radio object
a set of radio buttons on an htm form. a set of radio buttons lets the user choose one item from a list.
语法
to define a set of radio buttons, use standard htm 语法 with the addition of the onclick event handler:
<input
type="radio"
name="radioname"
value="buttonvalue"
[checked]
[onclick="handlertext"]>
texttodisplay
name="radioname" specifies the name of the radio object. all radio buttons in a group have the same name attribute. you can access this value using the name property.
value="buttonvalue" specifies a value that is returned to the server when the radio button is selected and the form is submitted. this defaults to "on". you can access this value using the value property.
checked specifies that the radio button is selected. you can access this value using the defaultchecked property.
texttodisplay specifies the label to display beside the radio button.
to use a radio button's properties and 用法:
1. radioname[index1].propertyname
2. radioname[index1].methodname(parameters)
3. formname.elements[index2].propertyname
4. formname.elements[index2].methodname(parameters)
radioname is the value of the name attribute of a radio object.
index1 is an integer representing a radio button in a radio object.
formname is either the value of the name attribute of a form object or an element in the
forms array.
index2 is an integer representing a radio button on a form. the
elements array contains an entry for each radio button in a radio object.
propertyname is one of the properties listed below.
methodname is one of the 用法 listed below.
property of
form
描述
a radio object on a form looks as follows:
a radio object is a form element and must be defined within a <form> tag.
all radio buttons in a radio button group use the same name property. to access the individual radio buttons in your code, follow the object name with an index starting from zero, one for each button the same way you would for an array such as forms: document.forms[0].radioname[0] is the first, document.forms[0].radioname[1] is the second, etc.
properties
checked lets you programatically select a radio button
defaultchecked reflects the checked attribute
length reflects the number of radio buttons in a radio object
name reflects the name attribute
value reflects the value attribute
用法
click
event handlers
onclick
例子
example 1. the following example defines a radio button group to choose among three music catalogs. each radio button is given the same name, name="musicchoice", forming a group of buttons for which only one choice can be selected. the example also defines a text field that defaults to what was chosen via the radio buttons but that allows the user to type a nonstandard catalog name as well. the onclick event handler sets the catalog name input field when the user clicks a radio button.
<![CDATA[<input type="text" name="catalog" size="20">
<input type="radio" name="musicchoice" value="s</p>
<div class="clear-both"></div>
</div>
<div class="pages"><a href=20050818223354358.htm target="_self" >首页</a>
<a href=20050818223354358_2.htm target="_self">下页</a>
<a href=20050818223354358_4.htm target="_self">尾页</a>
<a href=20050818223354358.htm target="_self"><strong>[1]</strong></a>
<a href=20050818223354358_2.htm target="_self">[2]</a>
<a href=20050818223354358_3.htm target="_self">[3]</a>
<a href=20050818223354358_4.htm target="_self">[4]</a>
</div>
<div class="keywords">
<strong>本文关键：</strong>javascript
</div>
<div class="ad_doc_ad_2">
<script type="text/javascript"><!--
google_ad_client = "pub-1022332794981269";
google_ad_width = 728;
google_ad_height = 90;
google_ad_format = "728x90_as";
google_ad_type = "text_image";
//2007-03-23: 方案站728x90
google_ad_channel = "2351411502";
google_color_border = "FFFFFF";
google_color_bg = "FFFFFF";
google_color_link = "3D81EE";
google_color_text = "4C4C4C";
google_color_url = "6C82B5";
//-->
</script>
<script type="text/javascript"
src="http://pagead2.googlesyndication.com/pagead/show_ads.js">
</script>
</div>
<div class="clear-both"></div>
</div>
</div>
<div id="content_right">
<div class="cbox" id="relate_doc">
<div class="darkboxTitle"><span> 相关方案</span></div>
<div class="ad_site_index_right_1">
<!-- SiteSearch Google -->
<form method="get" action="http://www.google.cn/custom" target="google_window">
<table border="0" bgcolor="#ffffff">
<tr><td nowrap="nowrap" valign="top" align="left" height="32">
<a href="http://www.google.com/">
<img src="http://www.google.com/logos/Logo_25wht.gif" border="0" alt="Google" align="middle"></img></a>
<br/>
<input type="hidden" name="domains" value="www.cn-doc.com"></input>
<label for="sbi" style="display: none">输入您的搜索字词</label>
<input type="text" name="q" size="15" maxlength="255" value="" id="sbi"></input>
<label for="sbb" style="display: none">提交搜索表单</label>
<input type="submit" name="sa" value="搜索" id="sbb"></input>
</td></tr>
<tr>
<td nowrap="nowrap">
<table>
<tr>
<td>
<input type="radio" name="sitesearch" value="" id="ss0"></input>
<label for="ss0" title="搜索网络"><font size="-1" color="#000000">Web</font></label></td>
<td>
<input type="radio" name="sitesearch" value="www.cn-doc.com" checked id="ss1"></input>
<label for="ss1" title="搜索 www.cn-doc.com"><font size="-1" color="#000000">www.cn-doc.com</font></label></td>
</tr>
</table>
<input type="hidden" name="client" value="pub-1022332794981269"></input>
<input type="hidden" name="forid" value="1"></input>
<input type="hidden" name="channel" value="9722277709"></input>
<input type="hidden" name="ie" value="GB2312"></input>
<input type="hidden" name="oe" value="GB2312"></input>
<input type="hidden" name="flav" value="0000"></input>
<input type="hidden" name="sig" value="Dl1iwOxBnXTtaDIa"></input>
<input type="hidden" name="cof" value="GALT:#008000;GL:1;DIV:#336699;VLC:663399;AH:center;BGC:FFFFFF;LBGC:336699;ALC:0000FF;LC:0000FF;T:000000;GFNT:0000FF;GIMP:0000FF;LH:50;LW:200;L:http://www.cn-doc.com/images/forgoogle.gif;S:http://www.cn-doc.com;FORID:1"></input>
<input type="hidden" name="hl" value="zh-CN"></input>
</td></tr></table>
</form>
<!-- SiteSearch Google -->
</div>
<ul class="darklist">
<li><a href="../../_soft_javascript_tech_doc/2005_08_18_22/20050818223354406.htm" title="下拉框联动" target="_blank">下拉框联动</a>…</li><li><a href="../../_soft_javascript_tech_doc/2005_08_18_22/20050818223354413.htm" title="FileSystemObject简介及应用" target="_blank">FileSystemObjec</a>…</li><li><a href="../../_soft_javascript_tech_doc/2005_08_18_22/20050818223354945.htm" title="JavaScript窗口功能指南之发挥窗口特征" target="_blank">JavaScript窗口功能指</a>…</li><li><a href="../../_soft_javascript_tech_doc/2005_08_18_22/20050818223354862.htm" title="JS编写的俄罗斯方块" target="_blank">JS编写的俄罗斯方块</a>…</li><li><a href="../../_soft_javascript_tech_doc/2005_08_18_22/20050818223355121.htm" title="HTML在线编辑器Word XP" target="_blank">HTML在线编辑器Word X</a>…</li><li><a href="../../_soft_javascript_tech_doc/2005_08_18_22/20050818223355720.htm" title="用Javascript制作一个可自动填写的文本框(二)" target="_blank">用Javascript制作一个</a>…</li><li><a href="../../_soft_javascript_tech_doc/2005_08_18_22/20050818223355332.htm" title="无提示框关闭IE窗口" target="_blank">无提示框关闭IE窗口</a>…</li><li><a href="../../_soft_javascript_tech_doc/2005_08_18_22/20050818223355107.htm" title="JavaScript图形库" target="_blank">JavaScript图形库</a>…</li><li><a href="../../_soft_javascript_tech_doc/2005_08_18_22/20050818223355169.htm" title="javascript版的日期输入控件" target="_blank">javascript版的日期输</a>…</li><li><a href="../../_soft_javascript_tech_doc/2005_08_18_22/20050818223355337.htm" title="超强幻灯片播放脚本（VBS）" target="_blank">超强幻灯片播放脚本（VBS）</a>…</li><li><a href="../../_soft_javascript_tech_doc/2005_08_18_22/20050818223354585.htm" title="绝对精彩：在网页里做类似window右键的弹出式菜单" target="_blank">绝对精彩：在网页里做类似win</a>…</li><li><a href="../../_soft_javascript_tech_doc/2005_08_18_22/20050818223353712.htm" title="怎样编写IE和NN6通用的闪烁(blank)效果？" target="_blank">怎样编写IE和NN6通用的闪烁</a>…</li><li><a href="../../_soft_javascript_tech_doc/2005_08_18_22/20050818223353944.htm" title="★★★ 检查应用程序的版本号 ★★★" target="_blank">★★★ 检查应用程序的版本号</a>…</li><li><a href="../../_soft_javascript_tech_doc/2005_08_18_22/20050818223353659.htm" title="得到 words.js?hello,world! 参数的处理方法" target="_blank">得到 words.js?hel</a>…</li><li><a href="../../_soft_javascript_tech_doc/2005_08_18_22/20050818223353257.htm" title="javascript: 改变和控制显示的图片大小（保持比例，同时可限制高宽）" target="_blank">javascript: </a>…</li><li><a href="../../_soft_javascript_tech_doc/2005_08_18_22/20050818223352480.htm" title="关于javascript中数组元素删除问题的讨论" target="_blank">关于javascript中数组</a>…</li><li><a href="../../_soft_javascript_tech_doc/2005_08_18_22/20050818223352837.htm" title="输入日期之改进模式" target="_blank">输入日期之改进模式</a>…</li><li><a href="../../_soft_javascript_tech_doc/2005_08_18_22/20050818223352126.htm" title="js客户端数据库的对象与函数" target="_blank">js客户端数据库的对象与函数</a>…</li><li><a href="../../_soft_javascript_tech_doc/2005_08_18_22/20050818223352764.htm" title="JavaScript窗口功能指南之检查一个窗口是否存在" target="_blank">JavaScript窗口功能指</a>…</li><li><a href="../../_soft_javascript_tech_doc/2005_08_18_22/20050818223352173.htm" title="如何显示年月日及星期问题" target="_blank">如何显示年月日及星期问题</a>…</li>
</ul>
<div class="ad_site_index_right_2">
<script type="text/javascript"><!--
google_ad_client = "pub-1022332794981269";
google_ad_width = 180;
google_ad_height = 60;
google_ad_format = "180x60_as_rimg";
google_cpa_choice = "CAAQ0cX8zwEaCEpGRZ0Cl8yyKPu_93M";
google_ad_channel = "6903800490";
//-->
</script>
<script type="text/javascript" src="http://pagead2.googlesyndication.com/pagead/show_ads.js">
</script>
</div>
</div>
</div>
<div class="clear-both"> </div>
<div id="ContentBottom" class="darkBox">
<p>本站最佳浏览方式为 分辨率 1024x768 IE 6.0（或更高版本的 IE浏览器）</p><a href="#"><img src="../../images/btn_top.gif" width="51" height="11" alt="go top"/></a>
</div>
</div>
</div>
<script type="text/javascript" language="javascript" src="../../comm/doc/w3c_99_bottom.js"></script>
<script type="text/javascript" language="javascript" src="../../comm/clicksum_doc.asp?typeid=46&infoid=390127"></script>
<script type="text/javascript" language="JavaScript" src="../../comm/statistics.js"></script>
</body>
</html>]]>