📄 day5_8.html
字号:
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312-80">
<style type="text/css">
<!--
a:link { color: blue; text-decoration: none}
a:visited { color: purple; text-decoration: none}
a:hover { color: #CC0033; text-decoration: underline}
-->
</style>
<title>JavaScript教程</title>
<script language="JavaScript">
<!-- hide me
function offButton()
{
var the_box = window.document.form_1.radio_1;
if (the_box.checked == true) {
window.document.form_1.radio_2.checked = false;
document.bgColor='black';
alert("Hey! Turn that back on!");
}
}
function onButton()
{
var the_box = window.document.form_1.radio_2;
if (the_box.checked == true) {
window.document.form_1.radio_1.checked = false;
document.bgColor='white';
alert("Thanks!");
}
}
// show me -->
</script>
</head>
<body topmargin="1" leftmargin="2">
<table border="0" width="591" cellspacing="0">
<tr>
<td bgcolor="#ffff99" width="451">JavaScript教程 - 第五课</td>
</tr>
<tr>
<td bgcolor="#FF6600" width="451"><a href="mailto:thau@wired.com">Thau</a></td>
</tr>
</table>
<div align="left">
<table border="0" width="630" cellspacing="0">
<tr>
<td width="458" valign="top" align="left"><small><small><br>
</small></small><strong>第八页：<font SIZE="3">单选框</font></strong> <p
ALIGN="JUSTIFY"> </p>
<table width="445" border="0" cellpadding="0" cellspacing="0">
<tr>
<td width="445"><font SIZE="3">在<font face="宋体">JavaScript</font>中单选框的用法和复选框是否相似。不同之处<br>
在于<font face="宋体">HTML</font>中的应用。复选框是一种开关。如果一个复选框被<br>
选中，你可以再点击后取消选取<font face="宋体">. </font>但如果单选框被选中，则<br>
只能通过选取另外一个单选框才能取消对该单选框的选取。例： <form>
<p><input type="radio" name="blah" value="larry" checked> <font face="宋体">Larry<br>
<input type="radio" name="blah" value="moe"> Moe<br>
<input type="radio" name="blah" value="curly"> Curly<br>
</font></p>
</form>
<p>在该例中，如果你打算取消对对一个单选框的选取，你必须<br>
集电极另一个单选框。用这种概念我们可以用两个单选框的<br>
设为代替一个复写纸的试着发式：</p>
<form name="form_1">
<p><font color="red"><input type="radio" name="radio_1" onClick="offButton();"> </font><font
face="宋体" color="red">Light off<br>
<input type="radio" name="radio_2" onClick="onButton();" checked> Light on<br>
</font></p>
</form>
<p>表单编码如下： </font></td>
</tr>
</table>
<ul>
<pre><font face="宋体"><big><form name="form_1">
<input type="radio" name ="radio_1" </big>
<big>onClick="offButton();">Light off
<input type="radio" name ="radio_2" </big>
<big>onClick="onButton();" checked>Light on
</form>
</big></font></pre>
</ul>
<table width="434" border="0" cellpadding="0" cellspacing="0">
<tr>
<td width="434"><font face="宋体" size="3">当第一个单选框被选中时，<tt>函数offButton()</tt>
被调用。函数<br>
如下： </font></td>
</tr>
</table>
<ul>
<pre><font face="宋体"><big>function offButton()
{
var the_box = </big>
<big>window.document.form_1.radio_1;
if (the_box.checked == true) </big>
<big>{
window.document.form_1.radio_2.checked = false;
document.bgColor='black';
alert("Hey! Turn that back on!");
}
}
</big></font></pre>
</ul>
<table width="438" border="0" cellpadding="0" cellspacing="0">
<tr>
<td width="438"><font face="宋体" size="3">这个例子很象前面的复选框例子，主要的区别在于该行：
</font></td>
</tr>
</table>
<ul>
<pre><big><font face="宋体">window.document.form_1.radio_2.checked = false;
</font></big></pre>
</ul>
<table width="434" border="0" cellpadding="0" cellspacing="0">
<tr>
<td width="434"><font face="宋体" size="3">该行指令指示JavaScript在该按钮被点击时关闭另外一个<br>
按钮。由于另外一个按钮的函数同这个很相似： </font></td>
</tr>
</table>
<ul>
<pre><font face="宋体"><big>function onButton()
{
var the_box = window.document.form_1.radio_2;
if (the_box.checked == true) </big>
<big> {
window.document.form_1.radio_1.checked = false;
document.bgColor='white';
alert("Thanks!");
}
}
</big></font></pre>
</ul>
<p align="left"><a href="day5_9.html" tppabs="http://www.pchome.net/ch/tur/pstext/teacher/javascript/day5_9.html">>></a></p>
<p align="left"><font face="宋体" size="3" color="#000000"><strong>JavaScript教程</strong></font><font
color="#FF0000" face="宋体" size="3"><br>
</font><font size="3"><font color="#FF0000">第一页</font> <a href="day5_8.html" tppabs="http://www.pchome.net/ch/tur/pstext/teacher/javascript/day5_8.html">第五课课程介绍</a><br>
<font color="#FF0000">第二页</font> <a href="day5_2.html" tppabs="http://www.pchome.net/ch/tur/pstext/teacher/javascript/day5_2.html">介绍反馈表单</a><br>
<font color="#FF0000">第三页</font> <a href="day5_3.html" tppabs="http://www.pchome.net/ch/tur/pstext/teacher/javascript/day5_3.html">控制文字域的值</a><br>
<font color="#FF0000">第四页</font> <a href="day5_4.html" tppabs="http://www.pchome.net/ch/tur/pstext/teacher/javascript/day5_4.html">文字域事件</a><br>
<font color="#FF0000">第五页</font> <a href="day5_5.html" tppabs="http://www.pchome.net/ch/tur/pstext/teacher/javascript/day5_5.html">反馈表单处理器</a><br>
<font color="#FF0000">第六页</font> <a href="day5_6.html" tppabs="http://www.pchome.net/ch/tur/pstext/teacher/javascript/day5_6.html">文字域的练习</a><br>
<font color="#FF0000">第七页</font> <a href="day5_7.html" tppabs="http://www.pchome.net/ch/tur/pstext/teacher/javascript/day5_7.html">复选框</a><br>
<font color="#FF0000">第八页</font> 单选框<br>
<font color="#FF0000">第九页</font> <a href="day5_9.html" tppabs="http://www.pchome.net/ch/tur/pstext/teacher/javascript/day5_9.html">选单</a><br>
<font color="#FF0000">第十页</font> <a href="day5_10.html" tppabs="http://www.pchome.net/ch/tur/pstext/teacher/javascript/day5_10.html">在选单中应用<font
face="宋体">onchange</font>命令</a></font></p>
<p align="left"><font face="宋体" size="3">[<a href="index.html" tppabs="http://www.pchome.net/ch/tur/pstext/teacher/javascript/index.html">第1课</a>][<a
href="day2_1.html" tppabs="http://www.pchome.net/ch/tur/pstext/teacher/javascript/day2_1.html">第2课</a>][<a href="day3_1.html" tppabs="http://www.pchome.net/ch/tur/pstext/teacher/javascript/day3_1.html">第3课</a>][<a href="day4_1.html" tppabs="http://www.pchome.net/ch/tur/pstext/teacher/javascript/day4_1.html">第4课</a>][第5课]</font></p>
<hr align="left">
<p><font size="2">本文由<a href="javascript:if(confirm('http://chd.126.com/ \n\nThis file was not retrieved by Teleport Pro, because it is addressed on a domain or path outside the boundaries set for its Starting Address. \n\nDo you want to open it from the server?'))window.location='http://chd.126.com/'" tppabs="http://chd.126.com/" target="_blank">《</font><font
face="verdana, arial, geneva, sans-serif" size="2">CHD</font><font size="2">的网络教室》</a>根据<a
href="javascript:if(confirm('http://www.webmonkey.com.cn/ \n\nThis file was not retrieved by Teleport Pro, because it is addressed on a domain or path outside the boundaries set for its Starting Address. \n\nDo you want to open it from the server?'))window.location='http://www.webmonkey.com.cn/'" tppabs="http://www.webmonkey.com.cn/" target="_blank">《网猴》</a>相关文章改编，版权归<a
href="javascript:if(confirm('http://www.webmonkey.com.cn/ \n\nThis file was not retrieved by Teleport Pro, because it is addressed on a domain or path outside the boundaries set for its Starting Address. \n\nDo you want to open it from the server?'))window.location='http://www.webmonkey.com.cn/'" tppabs="http://www.webmonkey.com.cn/" target="_blank">《网猴》</a>所有</font></td>
</tr>
</table>
</div>
</body>
</html>
⌨️ 快捷键说明
复制代码
Ctrl + C
搜索代码
Ctrl + F
全屏模式
F11
切换主题
Ctrl + Shift + D
显示快捷键
?
增大字号
Ctrl + =
减小字号
Ctrl + -