JavaScript có 3 kiểu hiển thị hộp thoại thông báo: Alert
box(Cảnh báo), Confirm box(xác nhận), Prompt box(gợi ý).
a. Hộp thoại cảnh báo (Alert Box):
Là loại hộp thoại cảnh báo thường được sử dụng để báo cho người
sử dụng có chắc chắn muốn thực hiện thao tác họ đăng thực hiện hay không. Khi
hộp thông báo hiện lên, nếu người dùng nhấn nút OK thì quá trình thực hiện thao
tác mới được tiến hành.
Cú pháp:
alert("sometext");
Ví dụ:
<html>
<head>
<meta
http-equiv="Content-Type" content="text/html;
charset=utf-8" />
<title>JavaScript
training </title>
<script
type="text/javascript">
function show_alert()
{
alert("Đây là hộp thoại hiển thị
cảnh báo!");
}
</script>
</head>
<body>
<input
type="button" onclick="show_alert()" value="Hiện Alert
Box" />
</body>
</html>
b. Hộp thoại xác nhận (Confirm Box):
Là một hộp thoại thường được sử dụng để yêu cầu người
sử dụng xác nhận có thực hiện một hành động nào đó hay không. Hộp thoại này có
2 nút nhấn "OK" và "Cancel". Nếu người sử dụng nhấn vào nút
"OK" hành động sẽ được thực hiện và ngược lại nếu người
sử dụng nhấn vào nút "Cancel" hành động sẽ bị hủy
bỏ.
Khi nhấn vào nút OK chúng ta sẽ nhận được một giá trị
của hộp thoại gửi về là true và ngược lại là false
Cú pháp:
confirm("sometext");
Ví dụ:
<html>
<head>
<meta
http-equiv="Content-Type" content="text/html;
charset=utf-8" />
<title>JavaScript
training </title>
<script
type="text/javascript">
function show_comfirm()
{
var comfirmBox;
comfirmBox = confirm("Hệ thống tên
lửa đã được kích hoạt.n Bạn có muốn phóng tên lửu đi không?");
if(comfirmBox == true){
document.write("Tên lửa đã
được phóng");
}else{
document.write("Quá trình
phóng tên lửa đã được hủy");
}
}
</script>
</head>
<body>
<input type="button"
onclick="show_comfirm()" value="Hiện Alert Box" />
</body>
</html>
c. Hộp thoại nhập liệu (Prompt box):
Là kiểu hộp thoại dùng để nhắc người sử dụng nhập một giá
trị nào đó để sau đó thực hiện một hành động nếu được nhấn nút OK. Trong hộp
thoại này cũng có 2 nút "OK" và "Cancel" giống như hộp
thoại Confirm. Khi nhấn vào nút OK chúng ta sẽ nhận được giá trị trong ô nhập
liệu của hộp thoại Confirm
Cú pháp:
prompt(text,value);
text: là thông tin hiển thị trên hộp thoại
value: là giá trị mặc định hiển thị trong ô nhập liệu của
hộp thoại.
Ví dụ:
<html>
<head>
<meta
http-equiv="Content-Type" content="text/html;
charset=utf-8" />
<title>JavaScript
training </title>
<script
type="text/javascript">
function show_prompt()
{
var name;
name = prompt("Tên của bạn
là gì?","Xin vui lòng nhập tên bạn vào đây");
if(name != ""
&& name != null){
document.write("Xin
chào " + name);
}
}
</script>
</head>
<body>
<input type="button"
onclick="show_prompt()" value="Hiện Alert Box" />
</body>
</html>
Posted in: Chuyên đề JavaScript cơ bản
