?? tutorial5_page5.htm
字號:
<html>
<head>
<meta HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=gb_2312-80">
<meta NAME="GENERATOR" CONTENT="Microsoft FrontPage 3.0">
<title>Webmonkey: javascript: Thau's JavaScript Tutorial: Day 1</title>
<meta NAME="keywords"
CONTENT="javascript, hotwired, webmonkey, javascript, javascript tutorial, thau, dave thau, developer resource, developer, development, web
development, design, code, geek, warez, free, new, latest, news, tools,
info, tutorials, how-to, builder, web builder, pag">
<meta NAME="description"
CONTENT="Thau's JavaScript Tutorial: Day 1: Not only does Thau give the JavaScript skinny, but he'll have you writing your first script by the end of the day.">
<meta NAME="Template" CONTENT="E:\LIZEJUN\OFFICE\html.dot">
</head>
<body TEXT="#000000" LINK="#0000ff" VLINK="#800080" BGCOLOR="#ffffff">
<table CELLSPACING="0" BORDER="0" CELLPADDING="3" WIDTH="702">
<tr>
<td WIDTH="77%" VALIGN="MIDDLE"><font FACE="宋體" LANG="ZH-CN" SIZE="4" COLOR="#ff0000"></font><b><font
FACE="System,黑體" LANG="ZH-CN" SIZE="5" COLOR="#ff0000">第</font><font FACE="宋體"
LANG="ZH-CN" SIZE="5" COLOR="#ff0000">5</font><font FACE="System,黑體" LANG="ZH-CN"
SIZE="5" COLOR="#ff0000">頁:表單處理器</font></b><font FACE="System,黑體"
LANG="ZH-CN"><br>
<!-- BYLINE --> </font><font FACE="System,黑體" LANG="ZH-CN" SIZE="2">作者:</font><a
HREF="mailto:thau@wired.com"><font FACE="宋體" LANG="ZH-CN" SIZE="2">Thau!</font></a><font
FACE="宋體" LANG="ZH-CN"> <!-- SEE ALSO LINKS --></font></td>
</tr>
<tr>
<td WIDTH="77%" VALIGN="TOP" BGCOLOR="#ffffff"><font FACE="System,黑體" LANG="ZH-CN"><ul>
<li></font> </li>
</ul>
</td>
</tr>
<tr>
<td WIDTH="77%" VALIGN="MIDDLE" BGCOLOR="#ffffff"><font FACE="System,黑體" LANG="ZH-CN">表單也是對象;他們有自己的方法、屬性、及事件<br>
處理器。其中有一項(xiàng)就是</font><tt><font FACE="宋體" LANG="ZH-CN">onSubmit</font><font
FACE="System,黑體" LANG="ZH-CN">。</font><p>onSubmit</tt><font FACE="System,黑體"
LANG="ZH-CN">的調(diào)用有以下兩種情形:如果用戶點(diǎn)擊遞<br>
交(</font><font FACE="宋體" LANG="ZH-CN">Submit</font><font FACE="System,黑體"
LANG="ZH-CN">)按鈕,或用戶在文字域內(nèi)按了回車<br>
鍵</font> <font FACE="System,黑體" LANG="ZH-CN">。試著點(diǎn)擊下面的</font><font
FACE="宋體" LANG="ZH-CN">Submit</font><font FACE="System,黑體" LANG="ZH-CN">按鈕看會發(fā)生什么情<br>
況。</p>
<form>
<p><input TYPE="submit"> </p>
</form>
<p>在</font><font FACE="宋體" LANG="ZH-CN">Netscape</font><font FACE="System,黑體"
LANG="ZH-CN">中,點(diǎn)擊一個沒有結(jié)果事件處理的<br>
</font><font FACE="宋體" LANG="ZH-CN">Submit</font><font FACE="System,黑體"
LANG="ZH-CN">按鈕通常會導(dǎo)致刷新原有的頁面。為了避免<br>
這種情況,你可以這樣做:</font></td>
</tr>
<tr>
<td WIDTH="77%" VALIGN="TOP" BGCOLOR="#ffffff"><ul>
<font FACE="System,黑體" LANG="ZH-CN">
<li></font><form onSubmit="return false;"> <input type="submit"
value="Submit"> </form> </li>
</ul>
</td>
</tr>
<tr>
<td WIDTH="77%" VALIGN="MIDDLE" BGCOLOR="#ffffff"><font FACE="System,黑體" LANG="ZH-CN">試著點(diǎn)擊下面的按鈕</font><font
FACE="宋體" LANG="ZH-CN">: <form>
<p><input TYPE="submit" VALUE="Click on me"> </p>
</form>
<p>Javascript</font><font FACE="System,黑體" LANG="ZH-CN">用</font><tt>return false</tt><font
FACE="System,黑體" LANG="ZH-CN">阻止瀏覽器刷新頁面。<br>
另一個例子是阻止一個</font><tt>href</tt><font FACE="System,黑體" LANG="ZH-CN">轉(zhuǎn)向賦值的</font><font
FACE="宋體" LANG="ZH-CN">URL </font><font FACE="System,黑體" LANG="ZH-CN">。例<br>
如:鏈接</font> </td>
</tr>
<tr>
<td WIDTH="77%" VALIGN="TOP" BGCOLOR="#ffffff"><font FACE="System,黑體" LANG="ZH-CN"><pre>
</font><a href=<a
HREF="tppmsgs/msgs0.htm#99">"http://www.mattmarg.com/"</a>
onClick="return false;">mattmarg!</a>
</pre>
</td>
</tr>
<tr>
<td WIDTH="77%" VALIGN="MIDDLE" BGCOLOR="#ffffff"><font FACE="System,黑體" LANG="ZH-CN">不會轉(zhuǎn)向任何</font><font
FACE="宋體" LANG="ZH-CN">URL</font><font FACE="System,黑體" LANG="ZH-CN">,因?yàn)槟憬o</font><font
FACE="宋體" LANG="ZH-CN">onClick</font><font FACE="System,黑體" LANG="ZH-CN">賦值為</font><font
FACE="宋體" LANG="ZH-CN">return <br>
false</font><font FACE="System,黑體" LANG="ZH-CN">。</font> <font FACE="System,黑體"
LANG="ZH-CN"><p>以下是一個從用戶獲取信息的表單。在文字域中輸入一些<br>
內(nèi)容然后點(diǎn)擊</font><font FACE="宋體" LANG="ZH-CN">Return:</p>
<form>
<b><p>Who does the monkey love: </b><input TYPE="text" NAME="monkey_love" size="20"> </font></p>
</form>
<font FACE="System,黑體" LANG="ZH-CN"><p>以下是表單的編碼:</font></td>
</tr>
<tr>
<td WIDTH="77%" VALIGN="TOP" BGCOLOR="#ffffff"><pre><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>
</pre>
</td>
</tr>
<tr>
<td WIDTH="77%" VALIGN="MIDDLE" BGCOLOR="#ffffff"><font FACE="System,黑體" LANG="ZH-CN">當(dāng)你點(diǎn)擊文字域中的</font><font
FACE="宋體" LANG="ZH-CN">Return</font><font FACE="System,黑體" LANG="ZH-CN">時,</font><tt>onSubmit</tt><font
FACE="System,黑體" LANG="ZH-CN">處理器被<br>
調(diào)用執(zhí)行函數(shù)</font><tt>monkeyLove()</tt><font FACE="System,黑體" LANG="ZH-CN">,該函數(shù)將改變文字域<br>
內(nèi)的值。<p>如果</font><font FACE="宋體" LANG="ZH-CN">onsubmit</font><font
FACE="System,黑體" LANG="ZH-CN">處理器中沒有</font><tt>return false</tt><font
FACE="System,黑體" LANG="ZH-CN">語句的<br>
話,執(zhí)行函數(shù)</font><tt>monkeyLove()</tt><font FACE="System,黑體" LANG="ZH-CN">會改變文字域內(nèi)容,但<br>
由于同時網(wǎng)頁內(nèi)容會被刷新,從而又會將文字域的<br>
內(nèi)容返回到原有的內(nèi)容。為了阻止這種現(xiàn)象,就必<br>
須在</font><tt>onSubmit</tt><font FACE="System,黑體" LANG="ZH-CN">中加入</font><font
FACE="宋體" LANG="ZH-CN">return false. </p>
</font><font FACE="System,黑體" LANG="ZH-CN"><p>以下是</font><tt>monkeyLove()</tt><font
FACE="宋體" LANG="ZH-CN"> </font><font FACE="System,黑體" LANG="ZH-CN">函數(shù)的內(nèi)容:</font>
</td>
</tr>
<tr>
<td WIDTH="77%" VALIGN="TOP" BGCOLOR="#ffffff"><pre>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;
}</pre>
</td>
</tr>
<tr>
<td WIDTH="77%" VALIGN="MIDDLE" BGCOLOR="#ffffff"><font FACE="System,黑體" LANG="ZH-CN">下面這個例子中沒有加入</font><font
FACE="宋體" LANG="ZH-CN">return false</font><font FACE="System,黑體" LANG="ZH-CN">,你將看到會發(fā)生<br>
什么情況:<form>
</font><font FACE="宋體" LANG="ZH-CN"><b><p>Who does the monkey love: </b><input
TYPE="text" NAME="monkey_love2" size="20"> </font></p>
</form>
<font FACE="System,黑體" LANG="ZH-CN"><p></font> </td>
</tr>
<tr>
<td WIDTH="77%" VALIGN="TOP" BGCOLOR="#ffffff"><!-- PAGE X LINKS --><font FACE="System,黑體" LANG="ZH-CN"><p>第</font><font
FACE="宋體" LANG="ZH-CN">1</font><font FACE="System,黑體" LANG="ZH-CN">頁:<a
HREF="tutorial5_page1.htm">第</font><font FACE="宋體" LANG="ZH-CN">5</font><font
FACE="System,黑體" LANG="ZH-CN">日課程介紹</a><br>
第</font><font FACE="宋體" LANG="ZH-CN">2</font><font FACE="System,黑體" LANG="ZH-CN">頁:<a
HREF="tutorial5_page2.htm">介紹反饋表單</a><br>
第</font><font FACE="宋體" LANG="ZH-CN">3</font><font FACE="System,黑體" LANG="ZH-CN">頁:<a
HREF="tutorial5_page3.htm">控制文字域的值</a><br>
第</font><font FACE="宋體" LANG="ZH-CN">4</font><font FACE="System,黑體" LANG="ZH-CN">頁:<a
HREF="tutorial5_page4.htm">文字域事件</a><br>
第</font><font FACE="宋體" LANG="ZH-CN">5</font><font FACE="System,黑體" LANG="ZH-CN">頁:<a
HREF="tutorial5_page5.htm">反饋表單處理器</a><br>
第</font><font FACE="宋體" LANG="ZH-CN">6</font><font FACE="System,黑體" LANG="ZH-CN">頁:<a
HREF="tutorial5_page6.htm">文字域的練習(xí)</a><br>
第</font><font FACE="宋體" LANG="ZH-CN">7</font><font FACE="System,黑體" LANG="ZH-CN">頁:<a
HREF="tutorial5_page7.htm">復(fù)選框</a><br>
第</font><font FACE="宋體" LANG="ZH-CN">8</font><font FACE="System,黑體" LANG="ZH-CN">頁:<a
HREF="tutorial5_page8.htm">單選框</a><br>
第</font><font FACE="宋體" LANG="ZH-CN">9</font><font FACE="System,黑體" LANG="ZH-CN">頁:<a
HREF="tutorial5_page9.htm">選單</a><br>
第</font><font FACE="宋體" LANG="ZH-CN">10</font><font FACE="System,黑體"
LANG="ZH-CN">頁:<a HREF="tutorial5_page10.htm">在選單中應(yīng)用</font><font
FACE="宋體" LANG="ZH-CN">onchange</font><font FACE="System,黑體" LANG="ZH-CN">命令</a><br>
</p>
</font><font FACE="System,黑體" LANG="ZH-CN" SIZE="4"><p><br>
</p>
</font><font FACE="System,黑體" LANG="ZH-CN"><p><br>
<!-- AUTHOR TAGLINE --> </font></td>
</tr>
<tr>
<td WIDTH="77%" VALIGN="MIDDLE"></td>
</tr>
</table>
<font FACE="System,黑體" LANG="ZH-CN">
<p> </p>
</font>
</body>
</html>
?? 快捷鍵說明
復(fù)制代碼
Ctrl + C
搜索代碼
Ctrl + F
全屏模式
F11
切換主題
Ctrl + Shift + D
顯示快捷鍵
?
增大字號
Ctrl + =
減小字號
Ctrl + -