1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
|
---
title: accesskey
slug: Web/HTML/Global_attributes/accesskey
tags:
- Global attributes
- HTML
- Reference
translation_of: Web/HTML/Global_attributes/accesskey
---
<div>{{HTMLSidebar("Global_attributes")}}</div>
<p><strong>accesskey</strong> <a href="/en-US/docs/Web/HTML/Global_attributes">全局属性</a> 提供了为当前元素生成快捷键的方式。属性值必须包含一个可打印字符。</p>
<div>{{EmbedInteractiveExample("pages/tabbed/attribute-accesskey.html","tabbed-shorter")}}</div>
<div class="note">
<p>注意：在WHATWG规范中，它说你可以指定多个空格分隔的字符，浏览器将使用它所支持的第一个字符。然而，这在大多数浏览器中是行不通的。在IE/Edge中，它将使用它支持的第一个没有问题的，只要没有与其他命令冲突。</p>
</div>
<p>激活 accesskey 的操作取决于浏览器及其平台。</p>
<table class="standard-table">
<tbody>
<tr>
<th> </th>
<th>Windows</th>
<th>Linux</th>
<th>Mac</th>
</tr>
<tr>
<th>Firefox</th>
<td colspan="2" rowspan="1" style="text-align: center;"><kbd>Alt</kbd> + <kbd>Shift</kbd> + <kbd><em>key</em></kbd></td>
<td>On Firefox 57 or newer, <kbd>Control</kbd> + <kbd>Option</kbd> + <kbd><em>key</em></kbd> -OR- <kbd>Control</kbd> + <kbd>Alt</kbd> + <kbd><em>key</em></kbd><br>
On Firefox 14 or newer, <kbd>Control</kbd> + <kbd>Alt</kbd> + <kbd><em>key</em></kbd><br>
On Firefox 13 or older, <kbd>Control</kbd> + <kbd><em>key</em></kbd></td>
</tr>
<tr>
<th>Internet Explorer</th>
<td><kbd>Alt</kbd> + <kbd><em>key</em></kbd></td>
<td colspan="2" rowspan="1">N/A</td>
</tr>
<tr>
<th>Google Chrome</th>
<td colspan="2" rowspan="1" style="text-align: center;"><kbd>Alt</kbd> + <kbd><em>key</em></kbd></td>
<td><kbd>Control</kbd> + <kbd>Alt</kbd> + <kbd><em>key</em></kbd></td>
</tr>
<tr>
<th>Safari</th>
<td><kbd>Alt</kbd> + <kbd><em>key</em></kbd></td>
<td>N/A</td>
<td><kbd>Control</kbd> + <kbd>Alt</kbd> + <kbd><em>key</em></kbd></td>
</tr>
<tr>
<th>Opera 15+</th>
<td colspan="2" rowspan="1" style="text-align: center;"><kbd>Alt</kbd> + <kbd><em>key</em></kbd></td>
<td><kbd>Control</kbd> + <kbd>Alt</kbd> + <kbd><em>key</em></kbd></td>
</tr>
<tr>
<th>Opera 12</th>
<td colspan="3" rowspan="1">
<p><kbd>Shift</kbd> + <kbd>Esc</kbd> opens a contents list which are accessible by accesskey, then, can choose an item by pressing <kbd><em>key</em></kbd></p>
</td>
</tr>
</tbody>
</table>
<p>要注意 Firefox 可以通过用户偏好，自定义所需的修饰键。</p>
<h2 id="可访问性">可访问性</h2>
<p>除了糟糕的浏览器支持之外， <code>accesskey</code>属性还有很多问题：</p>
<ul>
<li><code>accesskey</code> 值可能与系统或浏览器键盘快捷键或辅助技术功能相冲突。对于一个操作系统来说，辅助技术和浏览器组合可能无法与其他操作系统协同工作。</li>
<li>某些 <code>accesskey</code> 值可能不会出现在某些键盘上，特别是在国际化是一个问题的时候。</li>
<li>依赖于数字的 <code>accesskey</code> 值可能会让那些经历认知问题的人感到困惑，因为他们的数字与它触发的功能没有逻辑关联。</li>
<li>通知用户<code>accesskey</code>s 存在，这样他们就能意识到该功能。如果没有公开这些信息的方法，<code>accesskey</code>s 可能会被意外激活。</li>
</ul>
<p>由于这些问题，一般建议不要在大多数通用的网站和web应用程序中使用<code>accesskey</code> 属性。</p>
<ul>
<li><a href="https://webaim.org/techniques/keyboard/accesskey#spec">WebAIM: Keyboard Accessibility - Accesskey</a></li>
</ul>
<h2 id="规范">规范</h2>
<table class="standard-table">
<tbody>
<tr>
<th scope="col">Specification</th>
<th scope="col">Status</th>
<th scope="col">Comment</th>
</tr>
<tr>
<td>{{SpecName('HTML5.2', "editing.html#the-accesskey-attribute", "accesskey")}}</td>
<td>{{Spec2('HTML5.2')}}
<table>
<tbody>
</tbody>
</table>
</td>
<td>More realistic behavior described for what is implemented in reality.</td>
</tr>
<tr>
<td>{{SpecName('HTML WHATWG', "interaction.html#the-accesskey-attribute", "accesskey")}}</td>
<td>{{Spec2('HTML WHATWG')}}</td>
<td>与 {{SpecName('HTML5.1')}} 规范相同。</td>
</tr>
<tr>
<td>{{SpecName('HTML5.1', "editing.html#the-accesskey-attribute", "accesskey")}}</td>
<td>{{Spec2('HTML5.1')}}</td>
<td>与 {{SpecName('HTML5 W3C')}} 相同。</td>
</tr>
<tr>
<td>{{SpecName('HTML5 W3C', "editing.html#the-accesskey-attribute", "accesskey")}}</td>
<td>{{Spec2('HTML5 W3C')}}</td>
<td>可以将几个字符设置为accesskey。而且，它可以设置在任何元素上。</td>
</tr>
<tr>
<td>{{SpecName('HTML4.01', "interact/forms.html#h-17.11.2", "accesskey")}}</td>
<td>{{Spec2('HTML4.01')}}</td>
<td>只支持 {{ HTMLElement("a") }}, {{ HTMLElement("area") }}, {{ HTMLElement("button") }}, {{ HTMLElement("input") }}, {{ HTMLElement("label") }}, {{ HTMLElement("legend") }} and {{ HTMLElement("textarea") }}</td>
</tr>
</tbody>
</table>
<h2 id="浏览器兼容性">浏览器兼容性</h2>
<p>{{Compat("html.global_attributes.accesskey")}}</p>
<h2 id="参见">参见</h2>
<ul>
<li>{{domxref("Element.accessKey")}}</li>
<li>{{domxref("HTMLElement.accessKeyLabel")}}</li>
<li>所有 <a href="/en-US/docs/Web/HTML/Global_attributes">全局属性</a></li>
</ul>
|
