html подія onkeydown
Події keydown відбуваються при натисканні клавіші і дозволяють отримати її скан-код у властивості keyCode.
Скан-код клавіші однаковий в будь-якій розкладці і в будь-якому регістрі. Наприклад, клавіша "z" може означати символ "z", "Z"або "я", "Я" але її скан-код буде завжди однаковий: 90.
автор: NagarD
- Порада
-
порядок подій, пов'язаних з подію onkeydown:
- onkeydown
- onkeypress
- onkeyup
- Нотатка
-
Поява символу можна запобігти, якщо скасувати дію браузера на
keydown/keypress:<input onkeydown="return false" type="text" size="30">
автор: NagarD<input onkeypress="return false" type="text" size="30">
Синтаксис
<element onkeydown="script">Переглядачі
| Переглядач |  |
 |
 |
 |
 |
 |
|---|---|---|---|---|---|---|
| 1.0+ | 1.0+ | 1.0+ | 3.5+ | 12+ | 9+ |
| Переглядач |  |
 |
 |
 |
|---|---|---|---|---|
| 2+ | 74+ | 65+ | 4+ |
Приклади
+ запропонувати свій приклад у пісочниці
приклад використання HTML події onkeydown,onkeypress,onkeyup
HTML
<input type="text" placeholder="Кнопки нажимати тут" id="kinput" onkeydown="f()" onkeypress="f1()" onkeyup="f2()"><br>
<textarea id="area"></textarea>CSS
#kinput {
font-size: 150%;
box-sizing: border-box;
width: 95%;
}
#area {
width: 95%;
box-sizing: border-box;
height: 250px;
border: 1px solid black;
display: block;
}JS
var kinput = document.getElementById('kinput');
var area = document.getElementById('area');
function f() {
area.value += "onkeydown значення value " + kinput.value + "\n";
area.scrollTop = area.scrollHeight;
}
function f1() {
area.value += "onkypress значення value " + kinput.value + "\n";
area.scrollTop = area.scrollHeight;
}
function f2() {
area.value += "onkeyup значення value " + kinput.value + "\n\n";
area.scrollTop = area.scrollHeight;
}
//# sourceURL=pen.js Приклад використання HTML події onkeydown,onkeypress,onkeyup
HTML
<input type="text" placeholder="Кнопки нажимати тут" id="kinput" onkeypress ="f(event)" onkeydown ="f(event)" onkeyup ="f(event)" ><br>
<textarea id="area"></textarea>CSS
#kinput {
font-size: 150%;
box-sizing: border-box;
width: 95%;
}
#area {
width: 95%;
box-sizing: border-box;
height: 250px;
border: 1px solid black;
display: block;
}JS
var kinput = document.getElementById('kinput');
var area = document.getElementById('area');
var J = 0;
function f(e) {
J++;
area.value += e.type +
' keyCode=' + e.keyCode +
' which=' + e.which +
' charCode=' + e.charCode +
' char=' + String.fromCharCode(e.keyCode || e.charCode) + "\n";
area.scrollTop = area.scrollHeight;
}
//# sourceURL=pen.jsНайпростіший приклад використання HTML події onkeydown
HTML
<input type="text" placeholder="Кнопки нажимати тут" id="kinput" onkeydown="f(this)"><br>
<textarea id="area"></textarea>CSS
#kinput {
font-size: 150%;
box-sizing: border-box;
width: 95%;
}
#area {
width: 95%;
box-sizing: border-box;
height: 250px;
border: 1px solid black;
display: block;
}JS
var kinput = document.getElementById('kinput');
var area = document.getElementById('area');
var J = 0;
function f() {
J++;
area.value += "Ви нажали на кнопку " + J + " раз \n";
area.scrollTop = area.scrollHeight;
}
//# sourceURL=pen.jsКоментарі
Коментарів ще немає — будьте першим!