Ejecutar funciones JavaScript con onclick ASP.Net

Ejecutar funciones JavaScript con onclick o OnClientClick en ASP.Net permite trabajar con el cliente por medio de botones, links, etc.

¿Qué ventajas tiene?

La mayor ventaja que podemos encontrar es trabajar con el DOM de la página sin necesidad de llamar al servidor, traduciendo en mayor velocidad.

Sin embargo, también algunos botones requieren el postback de la página como por ejemplo Button.

Para los ejemplos utilizare un archivo JavaScript externo, únicamente agregare un enlace de referencia, más información en este post.

Agreguemos una serie de botones en la página aspx, con las propiedades necesarias para realizar la ejecución de JavaScript.

Con el código siguiente agregamos un enlace propio de asp.

<asp:LinkButton ID="lnkMensaje" runat="server" OnClientClick="MostrarMensaje('LinkButton');">Mostrar mensaje LinkButton</asp:LinkButton>

Mediante la propiedad OnClientClick asignamos la función en JavaScript que se ejecutara.

Utilicemos el control Button para hacer uso de funciones JavaScript con el siguiente código.

<button id="btnMensaje" onclick="MostrarMensaje('Boton');">Mostrar mensaje button</button>

En este caso la propiedad que se encarga de ejecutar la función JavaScript es onclick.

Podemos utilizar también la etiqueta a de HTML para trabajar con funciones de JavaScript en asp.

<a id="aMensaje" onclick="MostrarMensaje('Elemento A');">Mostrar mensaje a</a>

La propiedad onclick es la encargada de ejecutar las funciones JavaScript.

Toma en cuenta al utilizar los controles LinkButton o Button, estos realizan un postback, provocando la carga de la página.

La etiqueta a no genera un postback, por lo tanto, trabaja de forma rápida con el DOM de la página.

Recuerda que los id de las etiquetas asp cambian al momento de ejecución, encuentra más información es este post.