Η JavaScript έχει τρία είδη αναδυόμενων πλαισίων: Πλαίσιο ειδοποίησης, πλαίσιο επιβεβαίωσης και πλαίσιο προτροπής.
Ένα πλαίσιο ειδοποίησης χρησιμοποιείται συχνά εάν θέλετε να βεβαιωθείτε ότι οι πληροφορίες έρχονται στον χρήστη.
Όταν εμφανιστεί ένα πλαίσιο ειδοποίησης, ο χρήστης θα πρέπει να κάνει κλικ στο "OK" για να προχωρήσει.
window.alert("sometext");Η μέθοδος window.alert() μπορεί να γραφτεί χωρίς το παράθυρο πρόθεμα.
Δοκιμάστε το μόνοι σας →
<!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>
Ένα πλαίσιο επιβεβαίωσης χρησιμοποιείται συχνά εάν θέλετε ο χρήστης να επαληθεύσει ή να αποδεχτεί κάτι.
Όταν εμφανιστεί ένα πλαίσιο επιβεβαίωσης, ο χρήστης θα πρέπει να κάνει κλικ είτε στο "OK" ή στο "Cancel" για να προχωρήσει.
Εάν ο χρήστης κάνει κλικ στο "OK", το πλαίσιο επιστρέφει true. Εάν ο χρήστης κάνει κλικ στο "Ακύρωση", το πλαίσιο επιστρέφει ψευδή.
window.confirm("sometext");Η μέθοδος window.confirm() μπορεί να γραφτεί χωρίς το πρόθεμα παραθύρου.
Δοκιμάστε το μόνοι σας →
<!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>
Ένα πλαίσιο προτροπής χρησιμοποιείται συχνά εάν θέλετε ο χρήστης να εισάγει μια τιμή πριν εισέλθει σε μια σελίδα.
Όταν εμφανιστεί ένα παράθυρο προτροπής, ο χρήστης θα πρέπει να κάνει κλικ είτε στο "OK" ή στο "Cancel" για να προχωρήσετε αφού εισαγάγετε μια τιμή εισόδου.
Εάν ο χρήστης κάνει κλικ στο "OK", το πλαίσιο επιστρέφει την τιμή εισόδου. Εάν ο χρήστης κάνει κλικ στο "Ακύρωση", το πλαίσιο επιστρέφει μηδενικό.
window.prompt("sometext","defaultText");Η μέθοδος window.prompt() μπορεί να γραφτεί χωρίς το πρόθεμα παραθύρου.
Δοκιμάστε το μόνοι σας →
<!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>
Για να εμφανίσετε τις αλλαγές γραμμής μέσα σε ένα αναδυόμενο πλαίσιο, χρησιμοποιήστε μια ανάδρομη κάθετο ακολουθούμενη από τον χαρακτήρα n.
Δοκιμάστε το μόνοι σας →
<!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>