📄 day5_5.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// a simple function that changes a text fieldfunction monkeyLove(){ var who_it_is = window.document.text_entry_form.monkey_love.value; who_it_is = 'The monkey loves ' + who_it_is; window.document.text_entry_form.monkey_love.value = who_it_is;}// a copy of the above function for another formfunction monkeyLove2(){ var who_it_is = window.document.text_entry_form2.monkey_love2.value; who_it_is = 'The monkey loves ' + who_it_is; window.document.text_entry_form2.monkey_love2.value = who_it_is;}// 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> <ul> <li><font SIZE="3"><table width="357" border="0" cellspacing="0" cellpadding="0"> <tr> <td>表单也是对象；他们有自己的方法、属性、及事件<br> 处理器。其中有一项就是<tt><font face="宋体">onSubmit</font>。</tt> <p><font face="宋体"><tt>onSubmit</tt></font>的调用有以下两种情形：如果用户点击递<br> 交（<font face="宋体">Submit</font>）按钮，或用户在文字域内按了回车<br> 键 。试着点击下面的<font face="宋体">Submit</font>按钮看会发生什么情<br> 况。</p> <form> <p><input type="submit" value="Submit"> </p> </form> <p>在<font face="宋体">Netscape</font>中，点击一个没有结果事件处理的<br> <font face="宋体">Submit</font>按钮通常会导致刷新原有的页面。为了避免<br> 这种情况，你可以这样做： </td> </tr> </table> <ul> <pre><font face="宋体"><form onSubmit="return false;"><input type="submit" value="Submit"></form></font></pre> </ul> <table width="357" border="0" cellspacing="0" cellpadding="0"> <tr> <td>试着点击下面的按钮<font face="宋体">: </font><form onSubmit="return false;"> <p><font face="宋体"><input type="submit" value="Click on me"> </font></p> </form> <p><font face="宋体">Javascript</font>用<font face="宋体"><tt>return false</tt></font>阻止浏览器刷新页面。<br> 另一个例子是阻止一个<font face="宋体"><tt>href</tt></font>转向赋值的<font face="宋体">URL </font>。例<br> 如：链接 </td> </tr> </table> <ul> <pre><font face="宋体"><a href=<a href="javascript:if(confirm('http://www.mattmarg.com/ \n\n文件并未依 Teleport Pro 取回，因为 它的域或路径超过开始网址中设置的范围。 \n\n你要从服务器上打开它吗？'))window.location='http://www.mattmarg.com/'" tppabs="http://www.mattmarg.com/">"http://www.mattmarg.com/"</a> onClick="return false;">mattmarg!</a></font></pre> </ul> <table width="357" border="0" cellspacing="0" cellpadding="0"> <tr> <td>不会转向任何<font face="宋体">URL</font>，因为你给<font face="宋体">onClick</font>赋值为<font face="宋体">return <br> false</font>。 <p>以下是一个从用户获取信息的表单。在文字域中输入一些<br> 内容然后点击<font face="宋体">Return:</font></p> <form name="text_entry_form" onSubmit="monkeyLove(); return false;"> <p><font face="宋体"><b>Who does the monkey love: </b><input type="text" name="monkey_love" size="40"> </font></p> </form> <p>以下是表单的编码： </td> </tr> </table> <ul> <pre><font face="宋体"><form name="text_entry_form" onSubmit="monkeyLove(); return false;"><b>Who does the monkey love: </b><input type="text" name="monkey_love" size="40"></form></font></pre> </ul> <table width="357" border="0" cellspacing="0" cellpadding="0"> <tr> <td>当你点击文字域中的<font face="宋体">Return</font>时，<font face="宋体"><tt>onSubmit</tt></font>处理器被<br> 调用执行函数<font face="宋体"><tt>monkeyLove()</tt></font>，该函数将改变文字域<br> 内的值。 <p>如果<font face="宋体">onsubmit</font>处理器中没有<font face="宋体"><tt>return false</tt></font>语句的<br> 话，执行函数<font face="宋体"><tt>monkeyLove()</tt></font>会改变文字域内容，但<br> 由于同时网页内容会被刷新，从而又会将文字域的<br> 内容返回到原有的内容。为了阻止这种现象，就必<br> 须在<font face="宋体"><tt>onSubmit</tt></font>中加入<font face="宋体">return false. </font></p> <p>以下是<font face="宋体"><tt>monkeyLove()</tt> </font>函数的内容： </td> </tr> </table> <ul> <pre><font face="宋体">function monkeyLove(){ var who_it_is = window.document.text_entry_form.monkey_love.value; who_it_is = 'The monkey loves ' + who_it_is; window.document.text_entry_form.monkey_love.value = who_it_is;}</font></font></pre> </ul> <table width="357" border="0" cellspacing="0" cellpadding="0"> <font SIZE="3"> <tr> <td>下面这个例子中没有加入<font face="宋体">return false</font>，你将看到会发生<br> 什么情况： <form name="text_entry_form2" onSubmit="monkeyLove2();"> <p><font face="宋体"><b>Who does the monkey love: </b><input type="text" name="monkey_love2" size="40"> </font></p> </form> </td> </tr> </font> </table> </li> </ul> <p><font face="宋体"><br> <a href="day5_6.html" tppabs="http://sun150-2.fimmu.edu.cn/doing/js1/day5_6.html">>></a></font></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_5.html" tppabs="http://sun150-2.fimmu.edu.cn/doing/js1/day5_5.html">第五课课程介绍</a><br> <font color="#FF0000">第二页</font> <a href="day5_2.html" tppabs="http://sun150-2.fimmu.edu.cn/doing/js1/day5_2.html">介绍反馈表单</a><br> <font color="#FF0000">第三页</font> <a href="day5_3.html" tppabs="http://sun150-2.fimmu.edu.cn/doing/js1/day5_3.html">控制文字域的值</a><br> <font color="#FF0000">第四页</font> <a href="day5_4.html" tppabs="http://sun150-2.fimmu.edu.cn/doing/js1/day5_4.html">文字域事件</a><br> <font color="#FF0000">第五页</font> 反馈表单处理器<br> <font color="#FF0000">第六页</font> <a href="day5_6.html" tppabs="http://sun150-2.fimmu.edu.cn/doing/js1/day5_6.html">文字域的练习</a><br> <font color="#FF0000">第七页</font> <a href="day5_7.html" tppabs="http://sun150-2.fimmu.edu.cn/doing/js1/day5_7.html">复选框</a><br> <font color="#FF0000">第八页</font> <a href="day5_8.html" tppabs="http://sun150-2.fimmu.edu.cn/doing/js1/day5_8.html">单选框</a><br> <font color="#FF0000">第九页</font> <a href="day5_9.html" tppabs="http://sun150-2.fimmu.edu.cn/doing/js1/day5_9.html">选单</a><br> <font color="#FF0000">第十页</font> <a href="day5_10.html" tppabs="http://sun150-2.fimmu.edu.cn/doing/js1/day5_10.html">在选单中应用<font face="宋体">onchange</font>命令</a></font></p> <p align="left"><font face="宋体" size="3">[<a href="index.html" tppabs="http://sun150-2.fimmu.edu.cn/doing/js1/index.html">第1课</a>][<a href="day2_1.html" tppabs="http://sun150-2.fimmu.edu.cn/doing/js1/day2_1.html">第2课</a>][<a href="day3_1.html" tppabs="http://sun150-2.fimmu.edu.cn/doing/js1/day3_1.html">第3课</a>][<a href="day4_1.html" tppabs="http://sun150-2.fimmu.edu.cn/doing/js1/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\n文件并未依 Teleport Pro 取回，因为 它的域或路径超过开始网址中设置的范围。 \n\n你要从服务器上打开它吗？'))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\n文件并未依 Teleport Pro 取回，因为 它的域或路径超过开始网址中设置的范围。 \n\n你要从服务器上打开它吗？'))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\n文件并未依 Teleport Pro 取回，因为 它的域或路径超过开始网址中设置的范围。 \n\n你要从服务器上打开它吗？'))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 + -