Este atributo de evento onkeydown funciona cuando el usuario presiona cualquier tecla del teclado.
Etiquetas compatibles: admite todos los elementos HTML EXCEPTO-
- <base>
- <bdo>
- <br>
- <cabeza>
- <html>
- <iframe>
- <meta>
- <parámetro>
- <script>
- <estilo>
- <título>
Sintaxis:
<element onkeydown = "script">
Valor de atributo: este atributo contiene un script de valor único que funciona cuando se presiona cualquier tecla del teclado.
Etiquetas compatibles: es compatible con todos los elementos HTML excepto <base>, <bdo>, <br>, <head>, <html>, <iframe>, <meta>, <param>, <script>, <style> y <título>.
Ejemplo:
html
<!DOCTYPE html>
<html>
<head>
<title> HTML | onkeydown Event Attribute </title>
<style>
h1 {
text-align: center;
color: green;
}
h2 {
text-align: center;
}
input[type=text] {
width: 100%;
padding: 12px 20px;
margin: 8px 0;
box-sizing: border-box;
font-size: 24px;
color: white;
}
p {
font-size: 20px;
}
</style>
</head>
<body>
<h1>GeeksforGeeks<h1>
<h2>onkeyup Event Attribute</h2>
<p>Release the key to set a green background color.</p>
<input type="text" id="demo" onkeydown="keydownFunction()"
onkeyup="keyupFunction()">
<script>
function keyupFunction() {
document.getElementById("demo").style.backgroundColor = "blue";
}
function keydownFunction() {
document.getElementById("demo").style.backgroundColor = "green";
}
</script>
</body>
</html>
Salida:
Pulse la tecla:
Suelta la llave:
Navegador compatible: los navegadores compatibles con el atributo de evento onkeydown se enumeran a continuación:
- Cromo
- explorador de Internet
- Firefox
- Safari
- Ópera
Publicación traducida automáticamente
Artículo escrito por Vishal Chaudhary 2 y traducido por Barcelona Geeks. The original can be accessed here. Licence: CCBY-SA