HTML | Atributo de evento onkeyup

Este atributo de evento onkeyup funciona cuando el usuario suelta la 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 onkeyup = "script">

Valor de atributo: este atributo contiene un script de valor único que funciona cuando se suelta la 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>onkeyup 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 keydownFunction() {
                document.getElementById("demo").style.backgroundColor = "blue";
            }
 
            function keyupFunction() {
                document.getElementById("demo").style.backgroundColor = "green";
            }
        </script>
    </body>
</html>                   

Salida:  
Pulse la tecla: 
 

onkeyup

Suelta la llave: 
 

onkeyup

Navegador compatible: los navegadores compatibles con el atributo de evento onkeyup 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

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *