⭐ 欢迎来到虫虫下载站！ | 📦 资源下载 📁 资源专辑 ℹ️ 关于我们
⭐ 虫虫下载站
📤 上传资源

📄 day5_5.html

📁 JScript 用户指南 JavaScript 语言参考 内容 ：JScript 函数 JScript 错误 JScript 方法 JScript 对象 JScript 语句 Scripting 运行
💻 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 field
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;
}

// a copy of the above function for another form
function 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="宋体">&lt;form onSubmit=&quot;return false;&quot;&gt;

&lt;input type=&quot;submit&quot; value=&quot;Submit&quot;&gt;

&lt;/form&gt;

</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="宋体">&lt;a href=<a href="javascript:if(confirm('http://www.mattmarg.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://www.mattmarg.com/'" tppabs="http://www.mattmarg.com/">&quot;http://www.mattmarg.com/&quot;</a> 
onClick=&quot;return false;&quot;&gt;mattmarg!&lt;/a&gt;

</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="宋体">&lt;form name=&quot;text_entry_form&quot; 
onSubmit=&quot;monkeyLove(); return false;&quot;&gt;

&lt;b&gt;Who does the monkey love: &lt;/b&gt;

&lt;input type=&quot;text&quot; name=&quot;monkey_love&quot; size=&quot;40&quot;&gt;

&lt;/form&gt;

</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://www.pchome.net/ch/tur/pstext/teacher/javascript/day5_6.html">&gt;&gt;</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://www.pchome.net/ch/tur/pstext/teacher/javascript/day5_5.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> 反馈表单处理器<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> <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_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 + -