Hiển thị thông báo trong JavaScript
Trong bài viết này, chúng ta sẽ đi tìm hiểu về một hàm rất thông dụng mà bất cứ ai học JavaScript đều biết nó. Đó là hàm alert() trong JavaScript. Show Khi bạn mở bất kỳ một trang web nào, đôi khi bạn sẽ thấy các cửa sổ bật lên hộp thoại cảnh báo (alert pop-up). Các hộp thoại cảnh báo này thực sự rất hữu ích với người dùng. Nó giúp cảnh báo người dùng về một điều gì đó quan trọng mà trang web muốn truyền tải. Khi hộp thoại cảnh báo được kích hoạt, chúng ta sẽ thấy dùng chữ hiển thị giải thích nguyên nhân tại sao hộp thoại cảnh báo đó lại xuất hiện. >> Xem ngay Tài liệu Java Core giúp bạn “Nâng Cấp” kỹ năng lập trình Định nghĩa hàm alert() trong JavaScriptHàm alert() trong JavaScript được sử dụng để hiển thi hộp thoại cảnh báo khi muốn đảm bảo thông tin đến với người dùng. Khi hộp thoại cảnh báo hiện lên, người dùng sẽ phải nhấp vào nút “OK” để tiếp tục. Hộp thoại cảnh báo sẽ lấy tiêu điểm ra khỏi cửa sổ hiện tại và buộc trình duyệt phải đọc cảnh báo đó. Vì vậy, bạn nên tránh lạm dụng phương pháp này nếu muốn hiển thị thông tin đến với người dùng, vì nó ngăn người dùng truy cập vào các phần khác của trang cho đến khi hộp thoại được đóng lại. Hộp thoại cảnh báo này không chứa bất cứ HTML hay CSS nào, nó hiển thị như thế nào phụ thuộc vào hệ điều hành và trình duyệt người dùng đang sử dụng. Nội dung cảnh báo tới người dùng thường mô tả về lỗi như “Email không hợp lệ” do người dùng nhập sai định dạng Email và nhấn “Submit”, thông báo như “Trang web này đang sử dụng cookies”,… Cú pháp hàm alert() trong JavaScriptCú pháp:
Bạn cũng có thể thay thế window.alert() bằng alert(), vì khi bỏ tiền tố window đi thì JavaScript vẫn hiểu rằng bạn đang muốn hiển thị hộp thoại cảnh báo.
Trong đó, message là một chuỗi chứa thông tin mà bạn muốn hiển thị cho người dùng. Ví dụ: Hiển thị một cảnh báo
Rất đơn giản phải không nào! Bạn cũng có thể sử dụng ngắt dòng trong hộp thoại này bằng ký tự “\n”:
Cách sử dụng hàm alert() trong JavaScriptKết hợp với ButtonBạn có thể tạo một nút để hiển thị hộp thoại cảnh báo khi người dùng nhấp vào. Ví dụ: Sử dụng nút để hiển thị cảnh báo
Hiển thị ngay từ khi tải trangHộp thoại cảnh báo có thể được hiển thị khi tệp tin HTML bắt đầu chạy, trước khi người dùng truy cập vào bất kỳ phần tử nào khác trên trang. Ví dụ: Hiển thị cảnh báo ngay từ khi tải trang
Sử dụng biến để tuỳ chỉnh dòng chữ hiển thịBạn có thể truyền biến vào hàm alert() trong JavaScript để hiển thị cảnh báo để dễ dàng tuỳ chỉnh dòng chữ hiển thị. Ví dụ: Sử dụng biến để truyền vào hàm alert()
Và bạn có thể đưa nó vào trong hàm để tái sử dụng đoạn code này. Điều này giúp cho bạn có thể hiển thị cảnh báo ở bất cứ đâu mà không cần viết lại code.
Đồng bộ với hàm alert()Bạn có thể sử dụng hàm alert() trong JavaScript để thực hiện các luồng đồng độ. Đồng bộ ở đây có nghĩa là việc thực thi code sẽ dừng lại khi hộp thoại cảnh báo được hiển thị và việc thực thi code sẽ tiếp tục sau khi hộp thoại cảnh báo được đóng. Ví dụ: Hiển thị hộp thoại cảnh báo sau 3 giây
Để chạy đoạn mã này, mình sẽ đưa nó vào trong button.
Hàm setTimeout() sẽ tạo bộ hẹn giờ cho đoạn mã, sau 3 giây, cảnh báo sẽ hiển thị. Tìm hiểu thêm về hàm setTimeout() trong JavaScript tại đây! Kết luậnHàm alert() trong JavaScript sẽ hiển thi hộp thoại cảnh báo khi muốn đảm bảo thông tin đến với người dùng. Chắc chắn bạn sẽ sử dụng hàm này nhiều trong quá trình học. Vì vậy, hãy ghi nhớ các cách dùng và trường hợp sử dụng. Và tất nhiên, tránh lạm dụng hàm alert() trong JavaScript quá nhiều vì nó sẽ gây ảnh hưởng không tốt đến trải nghiệm người dùng. |