Trở về

JS Tips: Cách chuyển hướng trang bằng Javascript

bởi Vi Nè

Bài viết này sẽ hướng dẫn bạn cách mà chuyển hướng cho các mục tiêu khác nhau bằng cách sử dụng Javascript, cách này có thể áp dụng trên các file html hoặc php đều được.

Với việc chuyển hướng url bằng javascript này tiện, nhanh nhưng vẫn còn rất hạn chế hơn việc chuyển hướng bằng .htaccess

Các bài viết liên quan đến chuyển hướng:

Để chuyển hướng 1 trang, mời bạn xem đoạn code sau:

<html>
   <head>
      
      <script type="text/javascript">
         <!--
            function Redirect() {
               window.location="https://cunghocweb.com";
            }
         //-->
      </script>
      
   </head>
   
   <body>
      <p>Bấm vào nút, bạn sẽ đi tới trang chủ.</p>
      
      <form>
         <input type="button" value="Chuyển hướng" onclick="Redirect();" />
      </form>
      
   </body>
</html>

Xem DEMO

Trên là ví dụ về 1 chuyển hướng bằng cách bấm vào nút, cũng khác gì link href đâu nhỉ?

Nếu như vậy thì hơi bất tiện là nó không tự động chuyển đi, phải bấm vào nữa thì hơi phiền phức đúng không. Nếu thế ta cho nó chuyển đi một url chỉ định một cách tự động khi truy cập vào.

<html>
   <head>
   
      <script type="text/javascript">
         
            function Redirect() {
               window.location="https://cunghocweb.com";
            }
            
            document.write("Bạn sẽ được chuyển đến trang khác sau 3 giây.");
            setTimeout('Redirect()', 3000);
         
      </script>
      
   </head>
   
   <body>
   </body>
</html>

Xem DEMO

Sử dụng các đoạn js dễ dàng và nhanh chóng, có thể dùng ở bất kỳ mã nguồn nào. Hãy theo dõi các bài viết khác ở key JS Tips nhé.

Chúng tôi tạm dừng chức năng bình luận, mọi thắc mắc vui lòng gửi thông qua mục liên hệ. Xin cám ơn!

Bài 5: Cách tạo comment trong Python

Bài 4: Cách khai báo biến trong Python

Bài 3: Cài đặt Intellij IDEA và chạy Hello World trong Python

Bài 2: Hướng dẫn download và cài đặt python trên Windows

Bài 5: Tìm hiểu về Props trong ReactJS

Bài 4: Components trong ReactJS

Bài 3: Giới thiệu JSX trong ReactJS

Bài 2: Cài đặt môi trường chạy ReactJS

Bài 18: Thuộc tính icon trong CSS

Các biểu tượng có thể dễ dàng được thêm vào trang HTML của b...

Bài 17: Thuộc tính box model trong CSS

Bài 16: Thuộc tính outline trong CSS

Bài 15: Thuộc tính Height/Width trong CSS

Chat Icon Close Icon