JavaScript遍历表单元素
- 1、下载文档前请自行甄别文档内容的完整性，平台不提供额外的编辑、内容补充、找答案等附加服务。
- 2、"仅部分预览"的文档,不可在线预览部分如存在完整性等问题,可反馈申请退款(可完整预览的文档不适用该条件!)。
- 3、如文档侵犯您的权益，请联系客服反馈,我们会尽快为您处理(人工客服工作时间：9:00-18:30)。
JavaScript遍历表单元素
运⾏效果：
源代码：
1<!DOCTYPE html>
2<html lang="zh">
3<head>
4<meta charset="UTF-8">
5<title>表单</title>
6</head>
7<body>
8<form name="myForm">
9<table>
10<tr>
11<td width="53%">
12<label for="fullName">姓名:</label><input id="fullName" type="text" name="fullName" size="20"><br />
13<label for="passWord">密码:</label><input id="passWord" type="password" name="passWord" size="20"></td>
14<td width="47%">性别:
15<input id="male" type="radio" name="gender" value="男" checked><label for="male">男</label>
16<input id="female" type="radio" name="gender" value="⼥"><label for="female">⼥</label>
17</td>
18</tr>
19<tr>
20<td width="53%">爱好：
21<input id="music" type="checkbox" name="music" value="ON"><label for="music">⾳乐</label>
22<input id="sports" type="checkbox" name="sport" value="ON"><label for="sports">运动</label>
23</td>
24<td width="47%"><label for="education">学历:</label>
25<select id="education" size="1" name="edu_level">
26<option>⼩学</option>
27<option>中学</option>
28<option selected>⼤学</option>
29<option>⼤学以上</option>
30</select>
31</td>
32</tr>
33<tr>
34<td width="100%" colspan="2"><label for="remark">⾃我介绍：</label><br/><textarea id="remark" rows="3" name="remark" cols="50"></textarea></td> 35</tr>
36<tr>
37<td align="center"><input type="submit" value="提交" name="submit_button"></td>
38<td>
39<button type="reset" name="reset_button">重置</button>
40</td>
41</tr>
42</table>
43</form>
44<hr/>
45<script type="text/javascript">
46var myform, element, i;
47 myform = document.myForm;
48 document.write("<h3>表单中有" + myform.length + "个元素:</h3>");
49for (i = 0; i < myform.length; i++) {
50 element = myform.elements[i];
51if (i > 0) document.write(",");
52 document.write();
53 }
54</script>
55
56</body>
57</html>。