Categories JavaScript

Hộp Popup trong JavaScript

JavaScript có ba kiểu hộp popup: hộp Alert (báo động), hộp Confirm (xác nhận), và hộp Prompt (nhắc nhở).


Hộp Alert

Hộp alert thường được dùng nếu bạn muốn chắc chắn thông tin đến được với người dùng.

Khi hộp cảnh báo alert bật ra, người dùng sẽ nhấn vào nút OK để xử lý.

Cú pháp

window.alert("văn bản");

Phương thức window.alert() có thể được viết không cần tiền tố window.

Ví dụ

alert("Tôi là hộp thông báo alert!");

Hộp xác nhận

Hộp xác nhận thường được sử dụng nếu bạn muốn người dùng xác nhận hoặc đồng ý điều gì đó.

Khi hộp xác nhận được bật ra, người dùng sẽ nhấn vào một trong hai nút “OK” hoặc “Cancel / bỏ qua” để xử lý.

Nếu người dùng click vào “OK”, hộp sẽ trả về kết quả true. Nếu người dùng click vào “Cancel”, hộp sẽ trả về kết quả false.

Cú pháp

window.confirm("văn bản");

Phương thức window.confirm() có thể được viết không cần tiền tố window.

Ví dụ

var r = confirm("Press a button");
if (r == true) {
x = "Bạn nhấn OK!";
} else {
x = "Bạn nhấn Cancel!";
}

Hộp nhắc

Hộp nhắc thường được sử dụng nếu bạn muốn người dùng nhập một giá trị trước khi vào một trang nào đấy.

Khi hộp nhắc bật ra, người dùng sẽ click vào “OK” hoặc “Cancel” để xử lý sau khi nhập giá trị input.

Nếu người dùng click “OK” hộp sẽ trả về giá trị input. Nếu người dùng click “Cancel” hộp sẽ trả về null.

Cú pháp

window.prompt("văn bản","văn bản mặc định");

Phương thức window.prompt() có thể được viết mà không cần tiền tố window.

Ví dụ

var person = prompt("Nhập tên của bạn", "Harry Potter");
if (person != null) {
document.getElementById("demo").innerHTML =
"Xin chào " + person + "! Hôm nay bạn thế nào?";
}

Xuống dòng

Để hiển thị xuống dòng trên trong hộp popup, sử dụng dấu gạch ngược với ký tự n.

Ví dụ

alert("Xin chào\nBạn thế nào?");
Back to Top