📄 day5_4.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 mefunction writeIt(the_word){ var word_with_return = the_word + "\n"; window.document.first_form.the_textarea.value += word_with_return;}// 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> </p> <table width="357" border="0" cellspacing="0" cellpadding="0"> <tr> <td><font size="3" face="宋体">文字域可以链接<tt>onBlur</tt>、<tt>onFocus</tt>、和<tt>onChange</tt>事件。<tt>当有<br> 人点击文字域的里边时则发生onFocus</tt>事件。而如果点击文<br> 字域的外面或按了tab键时则发生onblur事件。如果有人改<br> 变了文字域内的内容然后转到文字域外部的区域时则发生<br> <tt>onChange</tt>事件。 </font><p><font size="3" face="宋体">试着做这些事情看下面的文字域会发生什么情况。</font></p> <form name="first_form" onSubmit="return false;"> <p><font size="3" face="宋体"><input type="text" name="first_text" onFocus="writeIt('focus');" onBlur="writeIt('blur');" onChange="writeIt('change');" size="20"> </font></p> <p><font size="3" face="宋体"><textarea name="the_textarea" rows="10" cols="40"></textarea> </font></p> </form> <font SIZE="3"><p>以下是编制方法：文字域的编码： </font></td> </tr> </table> <ul> <pre><big><font face="宋体"><input type="text" name="first_text" onFocus="writeIt('focus');" onBlur="writeIt('blur');" onChange="writeIt('change');"></font></big></pre> </ul> <table width="357" border="0" cellspacing="0" cellpadding="0"> <tr> <td><font size="3" face="宋体">每一个事件处理器调用函数<tt>writeIt()</tt>，该函数在<br> 首部中已作了定义。首部中的编码如下： </font></td> </tr> </table> <ul> <pre><font face="宋体"><head><title>Text Field Events</title><script language="JavaScript"><!-- hide mefunction writeIt(the_word){ var word_with_return = the_word + "\n"; window.document.first_form.the_textarea.value += word_with_return;}// show me --></script></head></font></pre> </ul> <table width="357" border="0" cellspacing="0" cellpadding="0"> <tr> <td><font face="宋体">前几行是典型的JavaScript预定义。主体中的第1<br> 行</font></td> </tr> </table> <ul> <pre><font face="宋体">var word_with_return = the_word + "\n";</font></pre> </ul> <table width="357" border="0" cellspacing="0" cellpadding="0"> <tr> <td><font face="宋体">将一个变量<tt>word_with_return</tt>进行初始化为函数处<br> 理后的字符串并加上换行符<tt>"\n"</tt>.。注意<tt>"\n"</tt> 是标<br> 准的计算机指令。 </font><p><font face="宋体">下一行</font> </td> </tr> </table> <ul> <pre><font face="宋体">window.document.first_form.the_textarea.value += word_with_return;</font></pre> </ul> <table width="357" border="0" cellspacing="0" cellpadding="0"> <tr> <td><font face="宋体">将文字区域的值设置为其原值加新变量。其作用相<br> 当于 </font></td> </tr> </table> <ul> <pre><font face="宋体">window.document.first_form.the_textarea.value = window.document.first_form.the_textarea.value + word_with_return;</font></pre> </ul> <table width="357" border="0" cellspacing="0" cellpadding="0"> <tr> <td><font face="宋体">目前我们已经学习了文字域和文字区域（值）的属性，接下<br> 来我们学习文字域和文字区域处理所用的方法：<tt>blur()</tt>、<br> <tt>focus()</tt>、和<tt>select()。</tt></font> <p><font face="宋体">下面的链接显示了<tt>focus()</tt> 和<tt>()</tt>如何工作。注意他们工作一<br> 次后可能会终止功能。</font></p> <table> <tr> <td colspan="2"><form name="method_form"> <p><font face="宋体"><input type="text" name="method_text" size="40" value="Hey, hey, we're the monkeys"> </font></p> </form> </td> </tr> <tr> <td><font face="宋体"><a href="#" onMouseOver="window.document.method_form.method_text.focus();">Mouseover to focus</a> </font></td> <td><font face="宋体"><a href="#" onMouseOver="window.document.method_form.method_text.select();">Mouseover to select</a> </font></td> </tr> </table> <p><font face="宋体">以下为表单和链接的编码： </font></td> </tr> </table> <ul> <pre><font face="宋体"><form name="method_form"><input type="text" name="method_text" size=40 value="Hey, hey, we're the monkeys"></form><a href="#" onMouseOver="window.document.method_form.method_text.focus();">Mouseover to focus</a><a href="#" onMouseOver="window.document.method_form.method_text.select();">Mouseover to select</a></font></pre> </ul> <table width="357" border="0" cellspacing="0" cellpadding="0"> <tr> <td><font face="宋体">其使用方法和调用任何对象方法的做法是一样的：<br> <tt>object_name.method()</tt>. 该文字域的名称是 <br> <tt>window.document.form_name.text_field_name</tt>， <br> 所以用下列语句就可调用文字域的<tt>focus()</tt>方法。 </font></td> </tr> </table> <ul> <pre><font face="宋体">window.document.method_form.method_text.focus();</font></pre> </ul> <p align="left"><a href="day5_5.html" tppabs="http://sun150-2.fimmu.edu.cn/doing/js1/day5_5.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_4.html" tppabs="http://sun150-2.fimmu.edu.cn/doing/js1/day5_4.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> 文字域事件<br> <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_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 + -