Hoy os presentamos jQuery Alert Dialogs, un substituto del típico alert(), confirm() y prompt() de Javascript, con el que podemos darle un toque más estético y profesional a nuestro sitio web.

Para empezar tendremos que añadir jAlert después de incluir jQuery como en el ejemplo:

<script type="text/javascript" src="../js/jquery-1.4.2.min.js"></script>
<script type="text/javascript" src="../jalert/jquery.alerts.js"></script>
<link href="../jalert/jquery.alerts.css" rel="stylesheet" type="text/css" />

Ahora que ya tenemos incluido el script, vamos a hacer la primera prueba con el el substituto de alert:

jAlert("Actualidad jQuery", "Actualidad jQuery");

En la primera variable le añadiremos el texto que aparecerá dentro de la ventana, y en la segunda variable, el título de la ventana jAlert.

Ahora vamos a probar con confirm, que ahora será jConfirm:

jConfirm("¿Te gusta Actualidad jQuery?", "Actualidad jQuery", function(r) {
	if(r) {
		jAlert("Te gusta Actualidad jQuery", "Actualidad jQuery");
	} else {
		jAlert("No te gusta Actualidad jQuery", "Actualidad jQuery");
	}
});

Dependiendo de si hacemos click en Continuar o Cancelar, nos devolverá la variable r con el valor true o false.

Y para terminar vamos a probar con prompt, que ahora será jPrompt:

jPrompt("Introduce tu nombre", "", "Actualidad jQuery", function(r) {
	if(r) {
		jAlert("Tu nombre es "+r, "Actualidad jQuery");
	}
});

Al igual que en el ejemplo anterior, la variable r nos devolverá el texto que hayamos introducido en la ventana.

A continuación tenéis un ejemplo con alert(), confirm(), prompt(), jAlert(), jConfirm() y jPrompt(), para que veáis sus diferencias.

• Ejemplo
  
• Descarga jAlert 1.1