JavaScript har tre typer av popup-rutor: Alert box, Confirm box och prompt box.
En varningsruta används ofta om du vill se till att information kommer fram till användaren.
När en varningsruta dyker upp måste användaren klicka på "OK" för att fortsätta.
window.alert("sometext");Metoden window.alert() kan skrivas utan fönstret prefix.
Prova själv →
<!DOCTYPE html>
<html>
<body>
<h2>JavaScript Alert</h2>
<button onclick="myFunction()">Try it</button>
<script>
function myFunction() {
alert("I am an alert box!");
}
</script>
</body>
</html>
En bekräftelseruta används ofta om du vill att användaren ska verifiera eller acceptera något.
När en bekräftelseruta dyker upp måste användaren klicka på antingen "OK" eller "Avbryt" för att fortsätta.
Om användaren klickar på "OK" returnerar rutan true. Om användaren klickar på "Avbryt" kommer rutan tillbaka falskt.
window.confirm("sometext");Metoden window.confirm() kan skrivas utan fönsterprefixet.
Prova själv →
<!DOCTYPE html>
<html>
<body>
<h2>JavaScript Confirm Box</h2>
<button onclick="myFunction()">Try it</button>
<p id="demo"></p>
<script>
function myFunction() {
var txt;
if (confirm("Press a button!")) {
txt = "You pressed OK!";
} else {
txt = "You pressed Cancel!";
}
document.getElementById("demo").innerHTML = txt;
}
</script>
</body>
</html>
En promptruta används ofta om du vill att användaren ska mata in ett värde innan han går in på en sida.
När en uppmaningsruta dyker upp måste användaren klicka på antingen "OK" eller "Avbryt" för att fortsätta efter att ha angett ett inmatningsvärde.
Om användaren klickar på "OK" returnerar rutan inmatningsvärdet. Om användaren klickar på "Avbryt" returnerar rutan null.
window.prompt("sometext","defaultText");Metoden window.prompt() kan skrivas utan fönsterprefixet.
Prova själv →
<!DOCTYPE html>
<html>
<body>
<h2>JavaScript Prompt</h2>
<button onclick="myFunction()">Try it</button>
<p id="demo"></p>
<script>
function myFunction() {
let text;
let person = prompt("Please enter your name:", "Harry Potter");
if (person == null || person == "") {
text = "User cancelled the prompt.";
} else {
text = "Hello " + person + "! How are you today?";
}
document.getElementById("demo").innerHTML = text;
}
</script>
</body>
</html>
För att visa radbrytningar i en popup-ruta, använd ett snedstreck följt av tecknet n.
Prova själv →
<!DOCTYPE html>
<html>
<body>
<h2>JavaScript</h2>
<p>Line-breaks in a popup box.</p>
<button onclick="alert('Hello\nHow are you?')">Try it</button>
</body>
</html>