昨天闲了一天，看了几片电影。哈哈！
今天我们讲述的是--互动网页中最最最最最有用的---表单！！坐好了，别趴下！
表单入门：
基本的不说了，这里就讲一点：不论在javascript里引用什么都要用到它的名字。在绝大多数情况下，一个HTML对象的名字由它的标签的name属性决定。
那么如何得到拥护在表单元素里输入的内容呢？我们需要用到javascript树。正如你所知道的，网页上所有的东西都是document对象的一部分。当你用到文档中的某个东西，入一个表单，它总是document对象的一个属性。既然我们知道表单的名字，就很容易通过javascript访问它。
我们建立一个简单的表单页：
<html>
<head>
<title>a simple form </title>
</head>
<body>
<form name="simple">
<input type="text" name="stuff">
<input type="button" value="ok">
</form>
</body>
</html>
我们用document.simple.stuff.value得到名字为simple的表单中stuff的文本输入区域的值。注意，从现在开始，如果需要引用当前文档，我们都是用document，而不是window.
document。
*****试试用this*************
当你引用一个特定的表单对象（例如document.simple.stuff.valuse）时，需要输入很多的
字才能得到最后想要的值。在javascript中，我们可以用this。这个单词有着特殊的意思，它允许一个对象引用自己。例如在上面的这个例子中，用全名引用表单：document.simple，但是如果在一个表单中，（例如在form标签里写一个时间处理器，可以这样写：this。如：alert(this.stuff.value);
不知你们玩过这个游戏吗？看代码试试能看到吗：
<html>
<head>
<title>Madlibs Form</title>
<script language="JavaScript">
function makeMadlibs() {
var story="<html><head><title>Julius Caesar</title></head>"+
"<body><h1>Julius Caesar ’Libs</h1><p>"+
"Friends,Romans,"+
document.madlibs.input1.value+",lend me your"+
document.madlibs.input2.value+";<br>I come to"+
document.madlibs.input3.value+"Caesar,not to praise him.<br>"+
"The evil that men do lives after them;<br>"+
"The good is oft interred with their"+
document.madlibs.input4.value+";<br>So let it be with"+
document.madlibs.input5.value+"."+
"The noble Brutus<br>Hath told you Caesar was"+
document.madlibs.input6.value+":<br>"+
"If it were so,it was a grievous fault,<br>"+
"And grievously hath Caesar answer’d it.</p></body></htm>";
libsWin=window.open("","madlibs","width=400,height=250,scrollbar=yes");
libsWin.document.write(story);
libsWin.document.close();
}
</script>
</head>
<body>
<form name="madlibs">
<table>
<tr>
<td>Plural Noun:</td>
<td><input type="text" name="input1"></td>
</tr>
<tr>
<td>Part of Body:</td>
<td><input type="text" name="input2"></td>
<tr>
<td>Verb:</td>
<td><input type="text" name="input3"></td>
</tr>
<tr>
<td>Plural Noun:</td>
<td><input type="text" name="input4"></td>
</tr>
<tr>
<td>Politician:</td>
<td><input type="text" name="input5"></td>
</tr>
<tr>
<td>Adjective:</td>
<td><input type="text" name="input6"></td>
</tr>
</table>
<input type="button" value="Create Story" onclick="makeMadlibs();">
</form>
</body>
</html>
<body>部分我们就不不去讲解了，来看看javascript脚本，
函数makemadlibs（）包含了所有的动作。
首先函数创建了一个新的变量story。这个变量值是预先选好的故事素材和表单输入值的组合。按照正确的书许结合这里秒年个方面的信息就得到了最后的故事。
"Friend,Romans," + document.madlibs.input1.value + ",lend me your" +
这几行把景泰的故事文本和表单的输入值结合起来，这个短语一"Friends,Romans,"开始，然后加入第一个文本输入区的值document.madlibs.input1.value
接下来，函数加入短语“lend me your”
新故事“组装”完毕后，储存在变量story中，下面需要显示出来。函数的最后三行完成这个功能，首先，函数创建一个新的窗口，并命名为libsUin。然后，document.write()把story中的内容输出到窗口中。注意函数用的是libsWin.document.write(story)。如果我们用document.write(srory)，那么内容将回在当前窗口中显示，而不是先窗口。所以要在javascript树中要到到libsWin的位置，然后在那里显示。
而最后一句libsWin.document.close(),这是一个虽然小却很重要的细节，它告诉窗口你已
经完成写任务，并需要显示了。通常这叫做关闭数据流。虽然在使用document.write()时，这一句通常都不需要，但是当你向其他任何窗口中（而不是当前窗口）输出时都必须写是这句代码。
这一讲就讲这一个例子吧！好好回味一下！我去玩泡泡堂了！^_^
|
