Custom alert using Javascript

How can I create a custo开发者_高级运维m alert function in Javascript?

You can override the existing alert function, which exists on the window object:

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

This is the solution I came up with. I wrote a generic function to create a jQueryUI dialog. If you wanted, you could override the default alert function using Matt's suggestion: 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();
            }
        }]
    });
}

Technically you can change what the alert function does. But, you cannot change the title or other behavior of the modal window launched by the native alert function (besides the text/content).

If you're looking for a javascript/html/css replacement, I recommend checking out jQueryUI and its implementation of modal dialogs.

"override" way is not good enough, suggest you to create a custom popup box. The best benefit of this solution is that you can control every details.

No, you can not using the default alert. Not even formating. But, I recomend you using Sweet alert to do that.