Maison > interface Web > js tutoriel > Comment implémenter une fenêtre pop-up en javascript

Comment implémenter une fenêtre pop-up en javascript

青灯夜游
Libérer: 2023-01-06 11:14:23
original
14820 Les gens l'ont consulté

Méthode : 1. Utilisez alert() pour implémenter la fenêtre de boîte d'avertissement, la syntaxe "alert("text");" 2. Utilisez confirm() pour implémenter la fenêtre de boîte de confirmation, la syntaxe "confirm" ("text")" ;3. Utilisez prompt() pour implémenter la boîte d'invite, la syntaxe est "prompt("text","valeur par défaut")".

Comment implémenter une fenêtre pop-up en javascript

L'environnement d'exploitation de ce tutoriel : système Windows 7, JavaScript version 1.8.5, ordinateur Dell G3.

Méthode 1 : utilisez alert() pour implémenter la fenêtre de boîte d'avertissement.

Les boîtes d'alerte sont souvent utilisées pour garantir que les utilisateurs peuvent obtenir certaines informations.

Lorsque la boîte d'avertissement apparaît, l'utilisateur doit cliquer sur le bouton OK pour continuer l'opération. La méthode

Syntaxe

window.alert("sometext");
Copier après la connexion

window.alert() peut utiliser la méthode alert() directement sans l'objet window.

Exemple :

alert("你好,我是一个警告框!");
Copier après la connexion

Comment implémenter une fenêtre pop-up en javascript

Méthode 2 : Utilisez la fonction confirm() pour implémenter la fenêtre de boîte de confirmation

Les boîtes de confirmation sont généralement utilisées pour vérifier l'acceptation d'une action de l'utilisateur.

Lorsque la carte de confirmation apparaît, l'utilisateur peut cliquer sur "Confirmer" ou "Annuler" pour confirmer l'opération de l'utilisateur.

Lorsque vous cliquez sur "Confirmer", la boîte de confirmation renvoie vrai. Si vous cliquez sur "Annuler", la boîte de confirmation renvoie faux. La méthode

Syntaxe

window.confirm("sometext");
Copier après la connexion

window.confirm() peut utiliser la méthode confirm() directement sans l'objet window.

Exemple :

<p>点击按钮,显示确认框。</p>
<button onclick="myFunction()">点我</button>
<p id="demo"></p>
<script>
function myFunction(){
	var x;
	var r=confirm("按下按钮!");
	if (r==true){
		x="你按下了\"确定\"按钮!";
	}
	else{
		x="你按下了\"取消\"按钮!";
	}
	document.getElementById("demo").innerHTML=x;
}
</script>
Copier après la connexion

Rendu :

Comment implémenter une fenêtre pop-up en javascript

Comment implémenter une fenêtre pop-up en javascript

2-Comment implémenter une fenêtre pop-up en javascript

Comment implémenter une fenêtre pop-up en javascript

Méthode 3 : Utiliser la fonction prompt() pour implémenter la fenêtre de boîte d'invite

La boîte d'invite est souvent utilisée pour inviter l'utilisateur à saisir quelque chose avant saisir la valeur de la page.

Lorsque la boîte de dialogue apparaît, l'utilisateur doit saisir une certaine valeur, puis cliquer sur le bouton confirmer ou annuler pour continuer l'opération.

Si l'utilisateur clique sur Confirmer, la valeur de retour est la valeur saisie. Si l'utilisateur clique sur Annuler, la valeur de retour est nulle. La méthode

Syntaxe

window.prompt("sometext","defaultvalue");
Copier après la connexion

window.prompt() peut utiliser la méthode prompt() directement sans l'objet window.

Exemple :

<p>点击按钮查看输入的对话框。</p>
<button onclick="myFunction()">点我</button>
<p id="demo"></p>
<script>
function myFunction(){
	var x;
	var person=prompt("请输入你的名字","Harry Potter");
	if (person!=null && person!=""){
	    x="你好 " + person + "! 今天感觉如何?";
	    document.getElementById("demo").innerHTML=x;
	}
}
</script>
Copier après la connexion

Rendu :

Comment implémenter une fenêtre pop-up en javascript

Comment implémenter une fenêtre pop-up en javascript

【Étude recommandée : Tutoriel JavaScript avancé]

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Étiquettes associées:
source:php.cn
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal