JavaScript高级教程 - 第二课

作者： Thau   

这个例子比较复杂，我们来慢慢研究它．首先我们看一看电话
号码簿本身．它在文件头中定义为phone_book，有７条输入项：

var phone_book = new
Array();

phone_book["happy"] = "(203) 555-1234";

phone_book["sleepy"] =
"(203) 555-2345";

phone_book["sneezy"] = "(203)
555-4321";

phone_book["sleazy"] = "(203) 555-3245";

phone_book["sneery"]
= "(203) 555-3213";

phone_book["bleary"] = "(203)
555-2365";

phone_book["tweaked"] = "(203)
555-1664";

每条记录的关键字是小矮人的名字，而每条记录的值就是该小
矮人的电话号码．假设我们需要找到某个小矮人的电话号码，
例如Sneezy的电话号码，我们这样写：

var the_number = phone_book["sneezy"];

现在我们看看这个表单：

<form name="the_form">

<b>Name:</b>


<select onChange = "displayNumber(phone_book,
this.options[selectedIndex].value);">

<option value="happy">Happy

<option value="sleepy">Sleepy

<option
value="sneezy">Sneezy

<option value="sleazy">Sleazy

<option
value="sneary">Sneery

<option value="bleary">Bleary

<option
value="tweaked">Tweaked

</select>

<p>

    

<b>Number:</b>

<input type="text" name="number_box"
value="">

</form>

注意表单和表单内的元素都有名称，这样以来便于我们读取和
写入表单元素．

注意select标签中的onChange处理器的用法：当所选择的选项
变化时，它就调用函数displayNumber，该函数在文件头中已做
了定义．如果我在下拉选单中选择了sneezy，则表达式
this.options [selectedIndex].value 返回"sneezy"，如果你
对该部分的内容不熟悉，请先阅读上次的javascript教程－第5日
的内容．

确定了用户所选择的选项之后，我们进入函数displayNumber：

function
displayNumber(phone_book, entry)

{

    var the_number = phone_book[entry];


    window.document.the_form.number_box.value =
the_number;

}

它使用了两个参数－一个电话号码簿和一个名称，在函数第1
行中，

var the_number =
phone_book[entry];

观察一下电话号码簿上的名字，然后进入下一行，

window.document.the_form.number_box.value
= the_number;

填入表单元素的数字命名为number_box．

你可以看到相关数组是将一个字符串连接到另一个字符串的好
办法．你可以利用相关数组将名字连接到电话号码，密码，生
日以及其他各种资料．在之后的课程中我将向你们介绍利用相
关数组可以做的各种有用的技巧．>>

JavaScript高级教程
第一页 Javascript高级教程-第2日
第二页 神奇的字符串处理
第三页 子字符串
第四页 分割方法(splitting method)
第五页 相关数组
第六页 相关数组的一个例子
第七页 介绍cookie
第八页 深入了解cookies
第九页 读取cookies
第十页 复杂的cookies读取
第十一页 读取和编写多重cookies
第十二页 再次深入了解cookies
第十三页 cookie路径和域

[第1课][第2课][第3课][第4课][第5课]

来源： Wired Digital Inc.