?? tutorial5_page9.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">9</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="MIDDLE" BGCOLOR="#ffffff"><font FACE="System,黑體" LANG="ZH-CN">選單是我們所學的表單選項中最奇特的一種。有兩<br>
種基本的格式：下列選單和列表選單。以下為例<br>
子：<form>
<b><p>下列選單</font><font FACE="宋體" LANG="ZH-CN">:</b><br>
<select NAME="pulldown_1" size="1">
<option>probiscus </option>
<option>spider </option>
<option>lemur </option>
<option>chimp </option>
<option>gorilla </option>
<option>orangutan </option>
</select> </p>
</font><b><font FACE="System,黑體" LANG="ZH-CN"><p>列表選單</font><font
FACE="宋體" LANG="ZH-CN">:</b><br>
<select NAME="list_1" SIZE="3">
<option>probiscus </option>
<option>spider </option>
<option>lemur </option>
<option>chimp </option>
<option>gorilla </option>
<option>orangutan </option>
</select> </font></p>
</form>
<font FACE="System,黑體" LANG="ZH-CN"><p>它的奇特之處在于這個選單有名稱，但其中的各個<br>
選項沒有名稱。例如，在</font><font FACE="宋體" LANG="ZH-CN">HTML</font><font
FACE="System,黑體" LANG="ZH-CN">中，第</font><font FACE="宋體" LANG="ZH-CN">1</font><font
FACE="System,黑體" LANG="ZH-CN">個選單如<br>
下：</font> </td>
</tr>
<tr>
<td WIDTH="77%" VALIGN="TOP" BGCOLOR="#ffffff"><dir>
<pre><big>
<select name="pulldown_1" size=1>
<option>probiscus
<option>spider
<option>lemur
<option>chimp
<option>gorilla
<option>orangutan
</select>
</big></pre>
</dir>
</td>
</tr>
<tr>
<td WIDTH="77%" VALIGN="MIDDLE" BGCOLOR="#ffffff"><font FACE="System,黑體" LANG="ZH-CN">注意這個選單的名稱是</font><tt>pulldown_1</tt><font
FACE="System,黑體" LANG="ZH-CN">，但各個選項沒<br>
有名稱。所以要調用其中的各個選項則有點困難。<p>幸好數組可以幫助我們調用其中的選項。如果你想<br>
改變該下列選單中的第</font><font FACE="宋體" LANG="ZH-CN">2</font><font
FACE="System,黑體" LANG="ZH-CN">個選項，你可以這樣做：</font></td>
</tr>
<tr>
<td WIDTH="77%" VALIGN="TOP" BGCOLOR="#ffffff"><dir>
<pre><big>
window.document.form_1.pulldown_1.options[1].text = 'new_text';
</big></pre>
</dir>
</td>
</tr>
<tr>
<td WIDTH="77%" VALIGN="MIDDLE" BGCOLOR="#ffffff"><font FACE="System,黑體" LANG="ZH-CN">這是因為選單的元素有一個選項屬性，而該屬性是<br>
選單所有選項的集合而成的數組。點擊</font><a HREF="#"><font FACE="宋體"
LANG="ZH-CN"><b>錯誤！超級鏈接引用無效。</b></font></a><font
FACE="System,黑體" LANG="ZH-CN">然后從下拉選單從下列選單中查看其選項是<br>
否已經被改變。現在第</font><font FACE="宋體" LANG="ZH-CN">2</font><font
FACE="System,黑體" LANG="ZH-CN">個選項應該是</font><tt><font FACE="宋體"
LANG="ZH-CN">*thau*</font><font FACE="System,黑體" LANG="ZH-CN">。</tt><p>除了選項屬性，選單還有一項屬性叫做<br>
</font><tt>selectedIndex</tt><font FACE="System,黑體" LANG="ZH-CN">。大筆一個選項被選擇后，<br>
</font><tt>selectedIndex</tt><font FACE="System,黑體" LANG="ZH-CN">屬性將變成被選項的數組索引號<br>
（序列號）。選擇第</font><font FACE="宋體" LANG="ZH-CN">2</font><font
FACE="System,黑體" LANG="ZH-CN">個列表選單中的一個選項，<br>
然后檢查<a HREF="#"><b>錯誤！超級鏈接引用無效。</b></a>。記住數組中的第</font><font
FACE="宋體" LANG="ZH-CN">1</font><font FACE="System,黑體" LANG="ZH-CN">個選項的索引<br>
號是</font><font FACE="宋體" LANG="ZH-CN">0</font><font FACE="System,黑體"
LANG="ZH-CN">。</font></td>
</tr>
<tr>
<td WIDTH="77%" VALIGN="TOP" BGCOLOR="#ffffff"><dir>
<pre><big><a href="#" onClick="alert('index is: ' +
window.document.form_1.list_1.selectedIndex);
return false;">check the index.</a>
</big></pre>
</dir>
</td>
</tr>
<tr>
<td WIDTH="77%" VALIGN="MIDDLE" BGCOLOR="#ffffff"><font FACE="System,黑體" LANG="ZH-CN">表單的名稱是</font><tt>form_1</tt><font
FACE="System,黑體" LANG="ZH-CN">，列表選單的名稱是</font><tt>list_1</tt><font
FACE="System,黑體" LANG="ZH-CN">。</font><font FACE="宋體" LANG="ZH-CN"> </font><font
FACE="System,黑體" LANG="ZH-CN"><br>
</font><tt>selectedIndex</tt><font FACE="System,黑體" LANG="ZH-CN">屬性值為<br>
</font><tt>window.document.form_1.list_1.selectedIndex</tt><font FACE="System,黑體"
LANG="ZH-CN">。<br>
你還可以將</font><tt>selectedIndex</tt><font FACE="System,黑體" LANG="ZH-CN">設置如下：</font></td>
</tr>
<tr>
<td WIDTH="77%" VALIGN="TOP" BGCOLOR="#ffffff"><dir>
<pre><big>window.document.form_1.list_1.selectedIndex = 1;
</big></pre>
</dir>
</td>
</tr>
<tr>
<td WIDTH="77%" VALIGN="MIDDLE" BGCOLOR="#ffffff"><font FACE="System,黑體" LANG="ZH-CN">并高亮度顯示第</font><font
FACE="宋體" LANG="ZH-CN">2</font><font FACE="System,黑體" LANG="ZH-CN">個選項。<br>
<br>
一旦你得到被選項的索引號，你就可以發現其內<br>
容：</font> </td>
</tr>
<tr>
<td WIDTH="77%" VALIGN="TOP" BGCOLOR="#ffffff"><dir>
<pre><big>
var the_select = </big>
<big>window.document.form_1.list_1;
var the_index = </big>
<big>the_select.selectedIndex;
var the_selected = </big>
<big>the_select.options[the_index].text;
</big></pre>
</dir>
</td>
</tr>
<tr>
<td WIDTH="77%" VALIGN="MIDDLE" BGCOLOR="#ffffff"><font FACE="System,黑體" LANG="ZH-CN"></font><tt>selectedIndex</tt><font
FACE="System,黑體" LANG="ZH-CN">屬性很有用，但如果有多個選項同時<br>
被選中，會如何呢？有關這方面的內容請閱讀<br>
</font><a HREF="tppmsgs/msgs1.htm#100"><font FACE="宋體" LANG="ZH-CN">multiple selects</font></a><font
FACE="System,黑體" LANG="ZH-CN">。<p>選單元素的處理器為</font><tt>onChange()</tt><font
FACE="System,黑體" LANG="ZH-CN">。當選單發生變化<br>
時，則該處理器被激活。</font></td>
</tr>
<tr>
<td WIDTH="77%" VALIGN="TOP" BGCOLOR="#ffffff"><big><!-- PAGE X LINKS --></big><!-- this stuff checks if there are more pages in this story. if so, we'll
suck out the titles of those pages and build links. Right now, the maximum is
15 pages. --><!-- this is a mini-template that formats each pageX link. So, if a story
has 15 pages, we need to generate 15 links to it. This is how each one
will look... --> <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">文字域的練習</a><br>
第</font><font FACE="宋體" LANG="ZH-CN">7</font><font FACE="System,黑體" LANG="ZH-CN">頁：<a
HREF="tutorial5_page7.htm">復選框</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">在選單中應用</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="2"><p> </p>
</font><font FACE="System,黑體" LANG="ZH-CN" SIZE="4"><p><br>
</p>
</font><font FACE="System,黑體" LANG="ZH-CN" SIZE="2"><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>
?? 快捷鍵說明
復制代碼
Ctrl + C
搜索代碼
Ctrl + F
全屏模式
F11
切換主題
Ctrl + Shift + D
顯示快捷鍵
?
增大字號
Ctrl + =
減小字號
Ctrl + -