Alerta personalizada usando Javascript

Question

¿Cómo puedo crear una función de alerta personalizada en Javascript?

Answer 1

Puede anular la función existente alert, que existe en el objeto window:

window.alert = function (message) { 
    // Do something with message 
}; 

Answer 2

Si usted está buscando un reemplazo JavaScript/HTML/CSS, recomiendo echar un vistazo a jQueryUI y su aplicación de modal dialogs .

Answer 3

Técnicamente puede cambiar lo que hace la función de alerta. Sin embargo, no puede cambiar el título u otro comportamiento de la ventana modal iniciada por la función de alerta nativa (además del texto/contenido).

Answer 4

Esta es la solución que se me ocurrió. Escribí una función genérica para crear un cuadro de diálogo jQueryUI. Si lo desea, puede anular la función de alerta predeterminada utilizando la sugerencia de Matt: window.alert = alert2;

// Generic self-contained jQueryUI alternative to 
// the browser's default JavaScript alert method. 
// The only prerequisite is to include jQuery & jQueryUI 
// This method automatically creates/destroys the container div 
// params: 
//  message = message to display 
//  title = the title to display on the alert 
//  buttonText = the text to display on the button which closes the alert 
function alert2(message, title, buttonText) { 

    buttonText = (buttonText == undefined) ? "Ok" : buttonText; 
    title = (title == undefined) ? "The page says:" : title; 

    var div = $('<div>'); 
    div.html(message); 
    div.attr('title', title); 
    div.dialog({ 
     autoOpen: true, 
     modal: true, 
     draggable: false, 
     resizable: false, 
     buttons: [{ 
      text: buttonText, 
      click: function() { 
       $(this).dialog("close"); 
       div.remove(); 
      } 
     }] 
    }); 
} 

Answer 5

"anular" la forma no es lo suficientemente buena, le sugerimos que cree un cuadro emergente personalizado. El mejor beneficio de esta solución es que puede controlar todos los detalles.