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
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
|
---
title: keypress
slug: Web/API/Document/keypress_event
translation_of: Web/API/Document/keypress_event
---
<div>{{APIRef}}</div>
<p><span class="seoSummary">O evento <strong><code>keypress</code></strong> é disparado quando uma tecla que produz um valor do tipo caractere é pressionada. </span>Exemplos de chaves que produzem um valor de caractere são chaves alfabéticas, numéricas e de pontuação. Exemplos de chaves que não produzem um valor de caractere são as teclas modificadoras, como <kbd>Alt</kbd>, <kbd>Shift</kbd>, <kbd>Ctrl</kbd>, ou <kbd>Meta</kbd>.</p>
<h2 id="Informações_gerais">Informações gerais</h2>
<dl>
<dt>Especificação</dt>
<dd><a class="external" href="http://www.w3.org/TR/DOM-Level-3-Events/#event-type-keypress">DOM L3</a> {{deprecated_inline ()}}</dd>
<dt>Interface</dt>
<dd><a href="/en-US/docs/DOM/KeyboardEvent">KeyboardEvent</a></dd>
<dt>Bolhas</dt>
<dd>sim</dd>
<dt>Cancelável</dt>
<dd>sim</dd>
<dt>Alvo</dt>
<dd>Documento, Elemento</dd>
<dt>Ação padrão</dt>
<dd>Varia: <code>keypress</code>evento; lançar sistema de composição de texto; <code>blur</code>e <code>focus</code>eventos; <code>DOMActivate</code>evento; outro evento</dd>
</dl>
<h2 id="Propriedades">Propriedades</h2>
<table class="standard-table">
<thead>
<tr>
<th scope="col">Propriedade</th>
<th scope="col">Tipo</th>
<th scope="col">Descrição</th>
</tr>
</thead>
<tbody>
<tr>
<td><code>target</code> {{readonlyInline}}</td>
<td>EventTarget</td>
<td>O destino do evento (o destino mais alto na árvore do DOM).</td>
</tr>
<tr>
<td><code>type</code> {{readonlyInline}}</td>
<td>DOMString</td>
<td>O tipo de evento.</td>
</tr>
<tr>
<td><code>bubbles</code> {{readonlyInline}}</td>
<td>boleano</td>
<td>Se o evento normalmente borbulha ou não</td>
</tr>
<tr>
<td><code>cancelable</code> {{readonlyInline}}</td>
<td>boleano</td>
<td>Se o evento é cancelável ou não</td>
</tr>
<tr>
<td><code>view</code> {{readonlyInline}}</td>
<td>WindowProxy</td>
<td><a href="/en-US/docs/Web/API/Document/defaultView"><code>document.defaultView</code></a>( <code>window</code>do documento)</td>
</tr>
<tr>
<td><code>detail</code> {{readonlyInline}}</td>
<td><code>long</code>( <code>float</code>)</td>
<td>0</td>
</tr>
<tr>
<td><code>target</code> {{readonlyInline}}</td>
<td>EventTarget (elemento DOM)</td>
<td>Elemento focalizado processando o evento chave, elemento raiz se nenhum elemento de entrada adequado estiver focalizado.</td>
</tr>
<tr>
<td><code>char</code> {{readonlyInline}}</td>
<td>DOMString (string)</td>
<td>O valor do caractere da chave. Se a chave corresponder a um caractere imprimível, esse valor será uma string Unicode não vazia contendo esse caractere. Se a chave não tiver uma representação imprimível, esta é uma string vazia. Veja <a href="/en-US/docs/Web/API/KeyboardEvent#Key_names_and_Char_values">nomes de chaves e valores de caracteres</a> para os detalhes.
<div class="note"><strong>Nota:</strong> Se a chave for usada como uma macro que insere vários caracteres, o valor desse atributo é a cadeia inteira, não apenas o primeiro caractere.</div>
</td>
</tr>
<tr>
<td><code>key</code> {{readonlyInline}}</td>
<td>DOMString (string)</td>
<td>
<p>O valor-chave da chave representada pelo evento. Se o valor tiver uma representação impressa, o valor desse atributo será o mesmo da <code>char</code>propriedade. Caso contrário, é uma das cadeias de <a href="/en-US/docs/Web/API/KeyboardEvent/key/Key_Values">valores de chave</a> especificadas nos <a href="/en-US/docs/Web/API/KeyboardEvent/key/Key_Values">valores de chave</a> . Se a chave não puder ser identificada, seu valor será a string "Unidentified". Veja <a href="/en-US/docs/Web/API/KeyboardEvent#Key_names_and_Char_values">os nomes das chaves e os valores de caracteres</a> para mais detalhes. Somente leitura.</p>
</td>
</tr>
<tr>
<td><code>code</code> {{readonlyInline}}</td>
<td>DOMString (string)</td>
<td>Contém uma string que identifica a tecla física sendo pressionada. O valor não é afetado pelo layout do teclado atual ou pelo estado do modificador, portanto, uma chave específica sempre retornará o mesmo valor.</td>
</tr>
<tr>
<td><code>charCode</code> {{readonlyInline}}</td>
<td>Longo não assinado (int)</td>
<td>O número de referência Unicode da chave; esse atributo é usado apenas pelo <a href="/en-US/docs/Mozilla_event_reference/keypress"><code>keypress</code></a>evento. Para chaves cujo <code>char</code>atributo contém vários caracteres, esse é o valor Unicode do primeiro caractere nesse atributo.
<div class="warning"><strong>Aviso:</strong> este atributo está obsoleto; você deve usar em <code>char</code>vez disso, se disponível.</div>
</td>
</tr>
<tr>
<td><code>keyCode</code> {{readonlyInline}}</td>
<td>Longo não assinado (int)</td>
<td>Um código numérico dependente do sistema e da implementação que identifica o valor não modificado da tecla pressionada. Este é geralmente o código ASCII decimal ({{RFC (20)}}) ou Windows 1252 correspondente à chave; veja {{anch ("Códigos de teclas virtuais")}} para uma lista de valores comuns. Se a chave não puder ser identificada, esse valor será 0.
<div class="warning"><strong>Aviso:</strong> este atributo está obsoleto; você deve usar em <code>key</code>vez disso, se disponível.</div>
</td>
</tr>
<tr>
<td><code>which</code> {{readonlyInline}}</td>
<td>Longo não assinado (int)</td>
<td>Um código numérico dependente do sistema e da implementação identificando o valor não modificado da tecla pressionada; isso geralmente é o mesmo que <code>keyCode</code>.
<div class="warning"><strong>Aviso:</strong> este atributo está obsoleto; você deve usar em <code>key</code>vez disso, se disponível.</div>
</td>
</tr>
<tr>
<td><code>location</code> {{readonlyInline}}</td>
<td>longo (flutuar)</td>
<td>A localização da chave no dispositivo.</td>
</tr>
<tr>
<td><code>repeat</code> {{readonlyInline}}</td>
<td>boleano</td>
<td><code>true</code>se uma tecla foi pressionada o tempo suficiente para disparar a repetição da tecla, caso contrário <code>false</code>.</td>
</tr>
<tr>
<td><code>locale</code> {{readonlyInline}}</td>
<td>corda</td>
<td>O código do idioma para o evento principal, se disponível; caso contrário, a cadeia vazia.</td>
</tr>
<tr>
<td><code>ctrlKey</code> {{readonlyInline}}</td>
<td>boleano</td>
<td><code>true</code>se a chave de controle estava inativa quando o evento foi disparado. <code>false</code>de outra forma.</td>
</tr>
<tr>
<td><code>shiftKey</code> {{readonlyInline}}</td>
<td>boleano</td>
<td><code>true</code>se a tecla shift estava inativa quando o evento foi disparado. <code>false</code>de outra forma.</td>
</tr>
<tr>
<td><code>altKey</code> {{readonlyInline}}</td>
<td>boleano</td>
<td><code>true</code>se a tecla ALT estava desativada quando o evento foi disparado. <code>false</code>de outra forma.</td>
</tr>
<tr>
<td><code>metaKey</code> {{readonlyInline}}</td>
<td>boleano</td>
<td><code>true</code>se a meta key estava desativada quando o evento foi disparado. <code>false</code>de outra forma.</td>
</tr>
</tbody>
</table>
<h2 id="Exemplo">Exemplo</h2>
<pre class="brush: js">document.addEventListener ('keypress', (event) => {
const keyName = event.key;
alert ('keypress event \ n \ n' + 'chave:' + nome da chave);
});
</pre>
<h2 id="Browser_compatibility">Compatibilidade com navegadores</h2>
<p>O Chrome não dispara o <code>keypress</code>evento para atalhos de teclado conhecidos ( <a href="https://bugs.chromium.org/p/chromium/issues/detail?id=13891#c50">referência</a> ). Quais atalhos de teclado são conhecidos depende do sistema do usuário. Use o <code>keydown</code>evento para implementar atalhos de teclado.</p>
<h2 id="Eventos_Relacionados">Eventos Relacionados</h2>
<ul>
<li>{{event ("keydown")}}</li>
<li>{{event ("keyup")}}</li>
<li>{{event ("keypress")}}</li>
<li>{{event ("input")}}</li>
</ul>
|