这个例子比较复杂，我们来慢慢研究它．首先我们看一看电话号码簿本身．它在文件头中定义为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．

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