Điều hướng trang (Redirect) trong JavaScript
Điều hướng lại trang là gì? Bạn có thể gặp tình huống khi bạn click vào một URL để tới trang X nhưng bạn được điều hướng tới trang Y. Nó xảy ra là do Page Redirection – Điều hướng lại trang . Khái niệm này khác với: JavaScript – Refresh trang. Có nhiều lý do khác nhau để tại sao bạn muốn ...
Điều hướng lại trang là gì?
Bạn có thể gặp tình huống khi bạn click vào một URL để tới trang X nhưng bạn được điều hướng tới trang Y. Nó xảy ra là do Page Redirection – Điều hướng lại trang. Khái niệm này khác với: JavaScript – Refresh trang.
Có nhiều lý do khác nhau để tại sao bạn muốn redirect người dùng từ trang ban đầu. Dưới đây là một số lý do:
Page Redirection làm việc như thế nào?
Qui trình thực hiện của Page Redirection như sau:
Ví dụ 1
Nó là khá đơn giản để thực hiện Page Redirection sử dụng JavaScript tại Client-Side. Để điều hướng khách truy cập tới một trang mới, bạn chỉ cần thêm một dòng code trong khu vực head như sau:
<html>
<head>
<script type="text/javascript">
</script>
</head>
<body>
<p>Click the following button, you will be redirected to home page.</p>
<form>
<input type="button" value="Redirect Me" onclick="Redirect();" />
</form>
</body>
</html>
Kết quả
Ví dụ 2
Bạn có thể hiển thị một thông báo thích hợp cho khách truy cập trước khi điều hướng họ tới một trang mới. Điều này có thể cần một chút thời gian trì hoãn để tải trang mới. Ví dụ sau chỉ cách thực hiện tương tự. Tại đây, setTimeout() là một hàm có sẵn trong JavaScript mà có thể được sử dụng để thực thi lệnh khác sau một khoảng thời gian đã cho.
<html>
<head>
<script type="text/javascript">
</script>
</head>
<body>
</body>
</html>
Kết quả
You will be redirected to code24h.com main page in 10 seconds!
Ví dụ 3
Ví dụ sau chỉ cách điều hướng khách truy cập của bạn tới một trang khác dựa trên trình duyệt họ sử dụng.
<html>
<head>
<script type="text/javascript">
</script>
</head>
<body>
</body>
</html>
Follow fanpage của team https://www.facebook.com/vietjackteam/ hoặc facebook cá nhân Nguyễn Thanh Tuyền https://www.facebook.com/tuyen.vietjack để tiếp tục theo dõi các loạt bài mới nhất về Java,C,C++,Javascript,HTML,Python,Database,Mobile.... mới nhất của chúng tôi.
Các bài học JavaScript khác tại code24h:
