当我们希望一打开某个页面,焦点能够停留在第一个控件上的时候,可以写个简单的脚本,
然后放到onload事件处理函数中,比如说下面的一段代码:
<
html
>
< head >
< title > 用户注册 </ title >
</ head >
< body onload ="document.forms[0].elements[0].focus()" >
< form name ="form1" >
用 户 名: < input type ="text" name ="txtName" size ="20" />< br />
密 码: < input type ="password" name ="txtPassword" size ="20" />< br />
确认密码: < input type ="password" name ="txtRePassword" size ="20" />< br />
电子信箱: < input type ="text" name ="txtEmail" size ="20" />< br />
< input type ="submit" name ="submitForm1" value ="注 册" />< br />
</ form >
</ html >
< head >
< title > 用户注册 </ title >
</ head >
< body onload ="document.forms[0].elements[0].focus()" >
< form name ="form1" >
用 户 名: < input type ="text" name ="txtName" size ="20" />< br />
密 码: < input type ="password" name ="txtPassword" size ="20" />< br />
确认密码: < input type ="password" name ="txtRePassword" size ="20" />< br />
电子信箱: < input type ="text" name ="txtEmail" size ="20" />< br />
< input type ="submit" name ="submitForm1" value ="注 册" />< br />
</ form >
</ html >
当用户打开页面,焦点是可以定位在第一个字段的。document.forms[0].elements[0].focus()
表示把光标定位在页面上第一个表单的第一个元素上,如上例,就是txtName字段。
但是考虑一下下面的这段代码:
<
html
>
< head >
< title > 用户注册 </ title >
</ head >
< body onload ="document.forms[0].elements[0].focus()" >
< form name ="form1" >
< input type ="hidden" name ="txtID" value ="123456" />< br />
用 户 名: < input type ="text" name ="txtName" size ="20" />< br />
密 码: < input type ="password" name ="txtPassword" size ="20" />< br />
确认密码: < input type ="password" name ="txtRePassword" size ="20" />< br />
电子信箱: < input type ="text" name ="txtEmail" size ="20" />< br />
< input type ="submit" name ="submitForm1" value ="注 册" />< br />
</ form >
</ html >
< head >
< title > 用户注册 </ title >
</ head >
< body onload ="document.forms[0].elements[0].focus()" >
< form name ="form1" >
< input type ="hidden" name ="txtID" value ="123456" />< br />
用 户 名: < input type ="text" name ="txtName" size ="20" />< br />
密 码: < input type ="password" name ="txtPassword" size ="20" />< br />
确认密码: < input type ="password" name ="txtRePassword" size ="20" />< br />
电子信箱: < input type ="text" name ="txtEmail" size ="20" />< br />
< input type ="submit" name ="submitForm1" value ="注 册" />< br />
</ form >
</ html >
表单form1的第一个字段是隐藏字段,这个字段是不支持focus()方法的。在这种情况下,将
会出现JavaScript错误。并且这个时候我们也不是想把光标定位在那个不可见的字段上。这
里的关键是把焦点定位在第一个可见的表单字段上,可以写个处理的方法:
<
html
>
< head >
< title > 用户注册 </ title >
< script type ="text/javascript" >
// 焦点定位在表单第一个可见字段的方法
function focusOnFirst(){
// 检测页面是否存在表单
if (document.forms.length > 0 ){
for ( var i = 0 ;i < document.forms[ 0 ].elements.length;i ++ ){
var oField = document.forms[ 0 ].elements[i];
if (oField.type != " hidden " ){
oField.focus();
return ;
}
}
}
}
</ script >
</ head >
< body onload ="focusOnFirst()" >
< form name ="form1" >
< input type ="hidden" name ="txtID" value ="123456" />< br />
用 户 名: < input type ="text" name ="txtName" size ="20" />< br />
密 码: < input type ="password" name ="txtPassword" size ="20" />< br />
确认密码: < input type ="password" name ="txtRePassword" size ="20" />< br />
电子信箱: < input type ="text" name ="txtEmail" size ="20" />< br />
< input type ="submit" name ="submitForm1" value ="注 册" />< br />
</ form >
</ html >
< head >
< title > 用户注册 </ title >
< script type ="text/javascript" >
// 焦点定位在表单第一个可见字段的方法
function focusOnFirst(){
// 检测页面是否存在表单
if (document.forms.length > 0 ){
for ( var i = 0 ;i < document.forms[ 0 ].elements.length;i ++ ){
var oField = document.forms[ 0 ].elements[i];
if (oField.type != " hidden " ){
oField.focus();
return ;
}
}
}
}
</ script >
</ head >
< body onload ="focusOnFirst()" >
< form name ="form1" >
< input type ="hidden" name ="txtID" value ="123456" />< br />
用 户 名: < input type ="text" name ="txtName" size ="20" />< br />
密 码: < input type ="password" name ="txtPassword" size ="20" />< br />
确认密码: < input type ="password" name ="txtRePassword" size ="20" />< br />
电子信箱: < input type ="text" name ="txtEmail" size ="20" />< br />
< input type ="submit" name ="submitForm1" value ="注 册" />< br />
</ form >
</ html >
测试上面的代码,光标确实可以定位在第一个表单的第一个可见字段。