aboutsummaryrefslogtreecommitdiff
path: root/files/ru/web/api/htmlelement/tabindex/index.html
blob: fe41116fe44483aafcc06b2305530774c84d7f53 (plain)
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
---
title: HTMLElement.tabIndex
slug: Web/API/HTMLElement/tabIndex
translation_of: Web/API/HTMLOrForeignElement/tabIndex
---
<div>
<div>{{ APIRef("HTML DOM") }}</div>
</div>

<p>Свойство <code><strong>HTMLElement.tabIndex </strong>предоставляет</code> возможность вызова по кнопке Tab текущего элемента.</p>

<div>
<div>Вызов по табуляции происходит в следующем порядке:</div>

<ol>
 <li><span style="font-size: 14px; line-height: 1.5;">элементы с положительным tabIndex. <span style="font-size: 14px; line-height: 1.5;">Элементы, имеющие одинаковое значение tabIndex вызываются в порядке появления в коде.  <span style="font-size: 14px; line-height: 1.5;">Переход осуществляется от меньших tabIndex до больших tabIndex. </span></span></span></li>
 <li><span style="font-size: 14px; line-height: 1.5;">Элементы, которые не поддерживают атрибут tabIndex или поддерживают но tabIndex установлен в "0", выбираются по Tab в порядке их появления в коде.</span></li>
</ol>

<div>Элементы для которых установлена блокировка (disabled) не могут быть выбраны кнопкой Tab и не могут быть в фокусе.</div>

<div> </div>

<div><span style="font-size: 14px; line-height: 1.5;">Значения могут начинаться с любого числа, могут быть отрицательными и могут быть непоследовательными, однако разные браузеры можгут неправильно сработать при очень больших значениях.</span></div>

<div> </div>
</div>

<h2 id="Syntax" name="Syntax">Синтаксис</h2>

<pre class="syntaxbox"><em>elt</em>.tabIndex = <em>index</em>;
var <em>index</em> = <em>elt</em>.tabIndex;
</pre>

<ul>
 <li><em><var>index</var></em> - целое число</li>
</ul>

<h2 id="Example" name="Example">Пример</h2>

<pre class="brush:js">var b1 = document.getElementById("button1");

b1.tabIndex = 1;
</pre>

<h2 id="Specification" name="Specification">Спецификация</h2>

<p> </p>

<table class="standard-table">
 <thead>
  <tr>
   <th scope="col">Спецификация</th>
   <th scope="col">Статус</th>
   <th scope="col">Коментарии</th>
  </tr>
 </thead>
 <tbody>
  <tr>
   <td>{{SpecName('HTML WHATWG', '#dom-tabindex', 'tabindex')}}</td>
   <td>{{Spec2('HTML WHATWG')}}</td>
   <td>Не было изменений с {{SpecName('DOM2 HTML')}}.</td>
  </tr>
  <tr>
   <td>{{SpecName('DOM2 HTML', 'html.html#ID-40676705', 'tabindex')}}</td>
   <td>{{Spec2('DOM2 HTML')}}</td>
   <td>Не было изменений с {{SpecName('DOM1')}}.</td>
  </tr>
  <tr>
   <td>{{SpecName('DOM1', 'level-one-html.html#ID-40676705', 'tabindex')}}</td>
   <td>{{Spec2('DOM1')}}</td>
   <td>Начальное определение</td>
  </tr>
 </tbody>
</table>

<h2 id="Поддержка_в_браузерах">Поддержка в браузерах</h2>

<p>{{ CompatibilityTable() }}</p>

<div id="compat-desktop">
<table class="compat-table">
 <tbody>
  <tr>
   <th>Feature</th>
   <th>Chrome</th>
   <th>Firefox (Gecko)</th>
   <th>Internet Explorer</th>
   <th>Opera</th>
   <th>Safari</th>
  </tr>
  <tr>
   <td>Basic support</td>
   <td>{{ CompatVersionUnknown() }}</td>
   <td>{{ CompatVersionUnknown() }}</td>
   <td>{{ CompatVersionUnknown() }}</td>
   <td>{{ CompatVersionUnknown() }}</td>
   <td>{{ CompatVersionUnknown() }}</td>
  </tr>
 </tbody>
</table>
</div>

<div id="compat-mobile">
<table class="compat-table">
 <tbody>
  <tr>
   <th>Feature</th>
   <th>Android</th>
   <th>Chrome for Android</th>
   <th>Firefox Mobile (Gecko)</th>
   <th>IE Mobile</th>
   <th>Opera Mobile</th>
   <th>Safari Mobile</th>
  </tr>
  <tr>
   <td>Basic support</td>
   <td>{{ CompatVersionUnknown() }}</td>
   <td>{{ CompatVersionUnknown() }}</td>
   <td>{{ CompatVersionUnknown() }}</td>
   <td>{{ CompatVersionUnknown() }}</td>
   <td>{{ CompatVersionUnknown() }}</td>
   <td>{{ CompatVersionUnknown() }}</td>
  </tr>
 </tbody>
</table>
</div>

<h2 id="Смотрите_также">Смотрите также</h2>

<ul>
 <li><a href="/en-US/docs/Accessibility/Keyboard-navigable_JavaScript_widgets" title="Accessibility/Keyboard-navigable_JavaScript_widgets">Accessibility of keyboard-navigable JavaScript widgets</a></li>
 <li>The HTML <a href="/en-US/docs/Web/HTML/Global_attributes/tabindex"><strong>tabindex</strong></a> глобальный атрибут.</li>
</ul>