Dom核心之——表单聚焦
本例实现使打开页面第一个文本框聚焦功能：
1 <html>
2 <head>
3 <title>Login Page</title>
4 <style type="text/css">
5 * {
6 font-family:Tahoma,Arial,serif;
7 font-size:11pt;
8 line-height:25px;
9 }
10 body {
11 text-align:center;
12 min-width:760px;
13 }
14 #main {
15 width:720px;
16 margin:0 auto;
17 text-align:left;
18 }
19 input {display:block}
20 </style>
21 <script type="text/javascript">
22 function init() {
23 // 页面的第一个表单
24 var frm = document.forms[0];
25 if(frm) {
26 // 表单中的所有元素
27 var elements = frm.elements;
28 for(var i=0; i<elements.length; i++) {
29 if(elements[i].type=="text") {
30 // 聚焦到第一个文本输入框
31 elements[i].focus();
32 break;
33 }
34 }
35 }
36 }
37 </script>
38 </head>
39 <body onload="init()">
40 <div id="main">
41 <form action="#" method="post">
42 <span>用户名：</span><input type="text" name="username" id="username" />
43 <span>密码：</span><input type="password" name="password" id="password" />
44 <input type="submit" value="登录" />
45 </form>
46 </div>
47 </body>
48 </html>
2 <head>
3 <title>Login Page</title>
4 <style type="text/css">
5 * {
6 font-family:Tahoma,Arial,serif;
7 font-size:11pt;
8 line-height:25px;
9 }
10 body {
11 text-align:center;
12 min-width:760px;
13 }
14 #main {
15 width:720px;
16 margin:0 auto;
17 text-align:left;
18 }
19 input {display:block}
20 </style>
21 <script type="text/javascript">
22 function init() {
23 // 页面的第一个表单
24 var frm = document.forms[0];
25 if(frm) {
26 // 表单中的所有元素
27 var elements = frm.elements;
28 for(var i=0; i<elements.length; i++) {
29 if(elements[i].type=="text") {
30 // 聚焦到第一个文本输入框
31 elements[i].focus();
32 break;
33 }
34 }
35 }
36 }
37 </script>
38 </head>
39 <body onload="init()">
40 <div id="main">
41 <form action="#" method="post">
42 <span>用户名：</span><input type="text" name="username" id="username" />
43 <span>密码：</span><input type="password" name="password" id="password" />
44 <input type="submit" value="登录" />
45 </form>
46 </div>
47 </body>
48 </html>
