JavaScript har tre slags popup-bokse: Alert-boks, Bekræft-boks og Spørg-boks.
En advarselsboks bruges ofte, hvis du vil sikre dig, at information kommer igennem til brugeren.
Når en advarselsboks dukker op, skal brugeren klikke på "OK" for at fortsætte.
window.alert("sometext");
Metoden window.alert()
kan skrives uden vinduet præfiks.
Prøv det selv →
<!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æftelsesboks bruges ofte, hvis du ønsker, at brugeren skal bekræfte eller acceptere noget.
Når en bekræftelsesboks popper op, skal brugeren enten klikke på "OK" eller "Annuller" for at fortsætte.
Hvis brugeren klikker på "OK", returnerer boksen sand. Hvis brugeren klikker på "Annuller", vender boksen tilbage falsk.
window.confirm("sometext");
Metoden window.confirm()
kan skrives uden vinduespræfikset.
Prøv det selv →
<!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 promptboks bruges ofte, hvis du ønsker, at brugeren skal indtaste en værdi, før han går ind på en side.
Når en promptboks dukker op, skal brugeren enten klikke på "OK" eller "Annuller" for at fortsætte efter indtastning af en inputværdi.
Hvis brugeren klikker på "OK", returnerer boksen inputværdien. Hvis brugeren klikker på "Annuller", returnerer boksen null.
window.prompt("sometext","defaultText");
Metoden window.prompt()
kan skrives uden vinduespræfikset.
Prøv det selv →
<!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>
For at vise linjeskift inde i en pop op-boks skal du bruge en skråstreg efterfulgt af tegnet n.
Prøv det selv →
<!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>