事半功倍之js(五)

<link rel="File-List" href="file:///F:%5CRubbish%5CTemp%5Cmsohtmlclip1%5C01%5Cclip_filelist.xml"><link rel="themeData" href="file:///F:%5CRubbish%5CTemp%5Cmsohtmlclip1%5C01%5Cclip_themedata.thmx"><link rel="colorSchemeMapping" href="file:///F:%5CRubbish%5CTemp%5Cmsohtmlclip1%5C01%5Cclip_colorschememapping.xml"><style> </style>

第十二章 使用表单

1.使用文本框

2.使用密码框

<form name=form1>
<input type=password name=pw1 value=daylight>
</form>

3.使用隐藏字段

<form name=form1>
<input type=hidden name=hid1 value=piece of eight>
</form>

4.使用文本区域框

5.使用按钮

<form name=form1>
<input type=button name=button1 value=标准按钮>
</form>

<form name=form1>
<input type=text name=text1 size=45><br>
<input type=button name=button1 value=panic button onclick="document.form1.text1.value='sittle down,count to 10 and take a deep breath'">
</form>

 

<form name=form1>
<textarea name=ta1>how many grains of sand are there in the sahara desert?</textarea>
</form>

<form name=form1>
<textarea name=ta1 rows=4 onfocus="document.form1.ta1.select()"> how many grains of sand are there in the sahara desert?</textarea>
</form>

 

<form name=form1>
<input type=text value="information ,please"name=text1>
</form>

<form name=form1>
<input type=text name=text1 value=click here
onfocus=document.form1.text1.select()>
</form>

6.使用重置按钮

<form name=form1>
<input type=reset name=reset1 value="rest form">
</form>

7.使用提交按钮

<form name=form1>
<input type=submit name=submit1 value="submit form">
</form>

8.使用复选按钮

<form name=form1>
<input type=checkbox name=cb1 >computer savvy?
</form>

9.使用单选按钮

<form name=form1>
<input type=radio name=radio1>male
<input type=radio name=radio1>female
</form>

10.使用选择列表

<form name=form1>
<select name=select1 size=4>
<option name=option1 value=lon>london,England</option>
<option name=option2 value=dub>Dublin,Ireland</option>
</select>
</form>

11.验证表单的有效性

<form name=form1>
请输入1~4的整数:
<input type=text name=text1 size=4 onchange=validate()>
</form>

12.控制表单焦点

<form name=form1>
<input type=text name=text1 value=where is you focus?><br>
<input type=text name=text2 value=is there?><br>
<input type=text name=text3 value=or maybe here?><br>
<input type=button name=button1 value="text box #1" onclick=document.form1.text1.focus()><br>
<input type=button name=button2 value="text box #2" onclick=document.form1.text2.focus()><br>
<input type=button name=button3 value="text box #3" onclick=document.form1.text3.focus()><br>
</form>