HTML DOM accessKey 属性
JavaScript基础 2022-06-08 16:42:19小码哥的IT人生shichen
HTML DOM accessKey 属性
定义和用法
accessKey 属性可设置或返回访问文本域的快捷键。
注释：请使用 Alt + accessKey 为拥有指定快捷键的元素赋予焦点。
语法
textObject.accessKey=accessKey实例
下面的例子设置了文本域的快捷键：
<html>
<head>
<script type="text/javascript">
function setAccessKeys()
{
document.getElementById('fname').accessKey="n"
document.getElementById('pwd').accessKey="p"
}
</script>
</head>
<body onload="setAccessKeys()">
<form>
Name: <input id="fname" type="text" />
<br />
Password: <input id="pwd" type="password" />
</form>
</body>
</html>TIY
完整实例【为文本域添加快捷键】：
<html>
<head>
<script type="text/javascript">
function setAccessKeys()
{
document.getElementById('fname').accessKey="n"
document.getElementById('pwd').accessKey="p"
}
</script>
</head>
<body onload="setAccessKeys()">
<form>
Name: <input id="fname" type="text" />
<br />
Password: <input id="pwd" type="password" />
</form>
</body>
</html>
可以使用本站在线JavaScript测试工具测试上述代码运行效果：http://www.phpcodeweb.com/runjs.html
完整实例【为若干表单域添加快捷键】：
<html>
<head>
<script type="text/javascript">
function access()
{
document.getElementById('myName').accessKey="n"
document.getElementById('myPwd').accessKey="p"
document.getElementById('ie').accessKey="i"
document.getElementById('fx').accessKey="f"
document.getElementById('myButton').accessKey="b"
}
</script>
</head>
<body onload="access()">
<form>
姓名：<input id="myName" type="text" />
<br />
密码：<input id="myPwd" type="password" />
<br /><br />
选择您喜欢的浏览器：
<br />
<input type="radio" name="browser" id="ie" value="Internet Explorer">Internet Explorer<br />
<input type="radio" name="browser" id="fx" value="Firefox">Firefox
<br /><br />
<input type="button" value="点击我！" id="myButton" />
</form>
<p>（请使用 Alt + <i>accesskey</i> 为不同的表单字段赋予焦点。）
</p>
</body>
</html>
可以使用本站在线JavaScript测试工具测试上述代码运行效果：http://www.phpcodeweb.com/runjs.html
