Evento se refiere a las acciones realizadas por el visitante del sitio durante su interactividad con el sitio web (o página web). Puede haber varios tipos de eventos tales como
- El usuario hace clic en el botón.
- El usuario mueve el puntero del mouse sobre una imagen.
- El usuario presionó cualquier tecla del teclado, etc.
Ejemplo:
<!DOCTYPE html> <html> <head> <script src= "https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"> </script> <style type="text/css"> #e5 { width: 100px; height: 100px; border-radius: 0px; background-color: aqua; } </style> </head> <body> <p id="e1">Welcome.</p> <p id="e2">Learn and Explore</p> <p> <input type="text" id="e3" value="jQuery is powerful!" /> </p> <p id="e4" align="left">Geeks for Geeks</p> <p> <div id="e5"></div> </p> <button id="gfg1">Change Text</button> <button id="gfg2">Change HTML</button> <button id="gfg3">Change Value</button> <button id="gfg4">Change Alignment</button> <button id="gfg5">Change Shape</button> <script type="text/javascript"> $("#gfg1").click(function() { $("#e1").text("Geeks for Geeks"); }); $("#gfg2").click(function() { $("#e2").html("<b>Enrich your Knowledge.</b>"); }); $("#gfg3").click(function() { $("#e3").val("jQuery at Geeks for Geeks"); }); $("#gfg4").click(function() { $("#e4").attr("align", "center"); }); $("#gfg5").click(function() { $("#e5").css("border-radius", "50px"); }); </script> </body> </html>
Salida:
Antes de hacer clic en los botones:
Después de hacer clic en los botones:
La lista completa de eventos de jQuery se proporciona a continuación:
- jQuery | bind() con ejemplos
- jQuery | desenfoque() con ejemplos
- jQuery | change() con ejemplos
- jQuery | click() con ejemplos
- jQuery | dblclick() con ejemplos
- jQuery | propiedad event.currentTarget
- jQuery | propiedad event.data
- jQuery | propiedad event.delegateTarget
- jQuery | Método event.isDefaultPrevented()
- jQuery | Método event.isImmediatePropagationStopped()
- jQuery | Método event.isPropagationStopped()
- jQuery | propiedad event.namespace
- jQuery | propiedad event.pageX con ejemplos
- jQuery | propiedad event.pageY con ejemplos
- jQuery | Método event.preventDefault()
- jQuery | Propiedad event.relatedTarget con ejemplo
- jQuery | Propiedad event.result con ejemplos
- jQuery | Método event.stopImmediatePropagation()
- jQuery | método event.stopPropagation()
- jQuery | event.target Propiedad con ejemplo
- jQuery | propiedad event.timeStamp con ejemplo
- jQuery | propiedad event.type
- jQuery | evento.que propiedad
- jQuery | focus() con ejemplos
- jQuery | focusin() con ejemplos
- jQuery | focusout() con ejemplo
- jQuery | hover() con ejemplos
- jQuery | Keydown() con ejemplos
- jQuery | pulsación de tecla()
- jQuery | keyup() con ejemplos
- jQuery | cargar() con ejemplos
- jQuery | mousedown() con ejemplos
- jQuery | mouseenter() con ejemplos
- jQuery | mouseleave() con ejemplos
- jQuery | mousemove() con ejemplos
- jQuery | mouseout() con ejemplos
- jQuery | mouseover() con ejemplos
- jQuery | mouseup() con ejemplos
- jQuery | on() con ejemplos
- jQuery | uno() con ejemplos
- jQuery | ready() con ejemplos
- jQuery | redimensionar() con ejemplos
- jQuery | scroll() con ejemplos
- jQuery | select() con ejemplos
- jQuery | enviar() con ejemplos
- jQuery | método trigger()
- jQuery | método triggerHandler()
- jQuery | undelegate() con ejemplos
Publicación traducida automáticamente
Artículo escrito por Vishal_Khoda y traducido por Barcelona Geeks. The original can be accessed here. Licence: CCBY-SA