11
votes

Changer la façon dont une alerte JavaScript () ou une invite ()

Y a-t-il un moyen de modifier les looks d'une alerte d'alerte ou invite en JavaScript? Des choses comme l'ajout d'une image, la modification de la couleur ou de la taille de la police, et tout ce qui le rendra différent.


3 commentaires

Dupliqué possible de Alerte personnalisée à l'aide de JavaScript


Aussi JavaScript - Changer l'icône d'alerte (même réponse cependant :)


@Pekka 웃 c'est un peu différent. Les questions que vous avez postées sont plus rapportées à la manière dont l'alerte est livrée, plutôt que son style / look.


4 Réponses :


1
votes

L'alerte alerte code> et invite code> Fonctions API d'appel fournies par le navigateur, de sorte que vous n'ayez aucun contrôle sur la façon dont ils regardent.

Qu'est-ce que vous On pourrait EM> si elle redéfinit ces fonctions et peut-être utilisez peut-être quelque chose comme JQuery Modal, par exemple: P>

window.alert = function(message) {
    // Launch jQuery modal here..
};

window.prompt = function(message) {
    // Launch jQuery modal here..
};


0 commentaires

0
votes

Vous ne pouvez pas modifier cela; Mais vous pouvez utiliser quelque chose comme showmodaldialog , il a besoin d'une URI de charger le formulaire HMTL / CSS souhaité (si vous pouvez le conserver dans une page séparée).


0 commentaires

4
votes

Élargir sur l'idée de Matthew Abbott, il m'a frappé de vouloir une réponse qui utilise un vieil javascript unique sans recours à des cadres. Voici une page rapide et sale qui émet une div avec un simple bouton de fermeture et le message présenté dans le centre:

CSS rugueux pour le bouton Alertbox et la touche d'alerte P> XXX PRE>

Puis certains JavaScript pour remplacer la fonction d'alerte intégrée et fournir une fonction de fermeture pour gérer l'événement de clic sur l'alerteClose. P> xxx pré>

appelant alerte code>, comme Matthew Abbott a suggéré, affiche maintenant la Div que vous venez de créer et de cliquer sur le x le rejeter en le rendant invisible. P>

alert("hello from the dummy alert box.");


0 commentaires

0
votes

Une course rapide de mienne, en développant une partie du code sur cette page:

p>

<html>
<body>
<h1>This is your page</h1>
<p>With some content<p>
<button onclick="alert('Send some message')">Click me</button>
</body>
</html>


0 commentaires