Trong bài viết này chúng ta sẽ tìm hiểu về 3 hàm rất hay được sử dụng đó là hàm alert() – confirm() – prompt() trong JavaScript. Trong thực tế các hàm hiện tại rất ít khi được sử dụng do chúng có giao diện khá xấu. Lập trình viên sẽ tự code hoặc sử dụng thư viện khác để làm các popup trông đẹp hơn.
Hàm alert() trong JavaScript
Hàm alert() trong JavaScript thường được sử dụng để hiển thị một popup thông báo đến người dùng. Và cách sử dụng cũng khá là đơn giản:
|
1 |
alert('Hàm alert() trong JavaScript.'); |
Hoặc bạn có thể sử dụng sự kiện click như đã làm ở bài JavaScript là gì?
|
1 2 3 4 5 6 7 8 |
<!DOCTYPE html> <html> <head> </head> <body> <button onclick="alert('Hàm alert() trong JavaScript.')">Click me!</button> </body> </html> |
Hàm alert() được thực thi khi sự kiện onclick được kích hoạt.
Hàm confirm() trong JavaScript
Hàm confirm() trong JavaScript được sử dụng để hiển thị một popup yêu cầu người dùng xác nhận hành động. Nếu chọn Ok thì nó sẽ trả về TRUE, ngược lại sẽ trả về FALSE.
|
1 2 3 4 5 6 7 8 9 |
<!DOCTYPE html> <html> <head> <title>Hàm confirm() trong JavaScript</title> </head> <body> <button onclick="confirm('Are you ready?')">Continue!</button> </body> </html> |
Ở trên tôi đã sử dụng sự kiện khi người dùng click vào button thì dùng hàm confirm() để xác nhận xem khách hàng có chắc chắn với hành động của mình không.
Hàm prompt() trong JavaScript
Hàm prompt() trong JavaScript dùng để hiển thị một popup để lấy thông tin mà người dùng nhập vào.
|
1 |
prompt("Tiêu đề của ô input", "Nội dung mặc định trong ô input"); |
Ví dụ: Chúng ta tạo một popup bằng hàm prompt() để yêu cầu người dùng nhập tên của mình, sau khi đã có được tên thì sử dụng hàm alert() để thông báo.
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 |
<!DOCTYPE html> <html> <head> <title>Hàm prompt() trong JavaScript</title> </head> <body> <button onclick="getName()">Click!</button> </body> <script> function getName() { var name = prompt('Enter your name here', ''); if (name) { alert(name); } } </script> </html> |
Kết quả chúng ta sẽ được như sau:
Kết luận
Như vậy trong bài viết này chúng ta đã học về hàm alert() – confirm() – prompt() trong JavaScript. Nếu các bạn có bất kỳ thắc mắc gì về bài viết, vui lòng để lại bình luận bên dưới nhé.