Los botones de las páginas web se utilizan para proporcionar una experiencia de usuario interactiva. Como regla general, si la respuesta al clic de un botón no requiere el envío de datos al servidor, la interacción se implementa mediante scripts JavaScript. Los métodos para invocar el código JavaScript correspondiente pueden variar; a continuación se muestran varias opciones posibles para botones de diferentes tipos.
Instrucciones
Paso 1
Si la visualización de un botón en una página web se organiza mediante la etiqueta del botón, el código JavaScript se puede colocar en el atributo onclick. Por ejemplo, como este: botón Por supuesto, no es aconsejable poner un código suficientemente grande directamente en la etiqueta del botón; es mejor diseñarlo como una función y poner solo el código para llamar a esta función en el atributo onclick. Por ejemplo:
function showAlert () {
alerta ('¡Botón hecho clic!')
}
botón
Paso 2
Si el botón se muestra a través de una de las variaciones de la etiqueta de entrada (enviar, restablecer, botón o imagen), se puede usar el mismo atributo onclick. Por ejemplo, para que un botón borre campos de formulario (restablecer), el código podría verse así: Si desea que solo se ejecute JavaScript cuando se hace clic en el botón, y la acción predeterminada no ocurre, agregue el comando de retorno a la función o directamente al atributo onclick false. Por ejemplo:
Paso 3
Si necesita organizar una respuesta para hacer clic en un botón del tipo de envío, entonces, además del método anterior usando el atributo onclick, puede usar las propiedades de la etiqueta de formulario a la que pertenece este botón. La llamada de función correspondiente se puede colocar en el atributo onsubmit de la etiqueta del formulario. Por ejemplo:
Paso 4
Si el botón no es un elemento de formulario, sino simplemente un elemento gráfico (etiqueta img), los estándares para él también permiten el uso del atributo onclick. Por ejemplo:
Paso 5
Si el botón es un hipervínculo, entonces no debe usar los atributos del botón en sí; es mejor usar las propiedades de la etiqueta del enlace. Puede, como en las opciones anteriores, utilizar la etiqueta onclick. Por ejemplo: Y puede reemplazar la dirección en el atributo href con una llamada de función. Por ejemplo, así:
