Redirecting a web page means, taking the user to a new location. Many website uses redirects for many different reasons, e.g. Some websites redirect users from the old domain to new domain, some redirect from one page to another e.g. a more relevant page. If you are a Java programmer and worked previously with Servlet and JSP, then you might be familiar with SendRedirect and Forward methods, which are used to redirect users in web applications. Actually, there are two kinds of redirect, Server side redirect, and client-side redirect. In Server side redirect, server initiates redirection, while in a client-side redirect, client code does the redirection. Redirecting a web page using JavaScript and JQuery is a client-side redirection.

Đang xem: How to redirect to another page using jquery

Well, HTTP redirection is a big topic and different people do it differently. e.g. bloggers mostly used platforms like WordPress, Blogger feature to redirect a page, though this might be restricted to the same domain.In this JavaScript and jQuery tutorial, we will learn a new JQuery tip to redirect a page.Btw, If you are learning jQuery then I also suggest you keep a copy of Head First jQuery, I have and always look back on this book whenever I stuck. It has got some good examples, which you can always refer back to.And, If you want to learn Modern JavaScript or level up your skills then I suggest you joinThe Complete JavaScript Course: Build Real Projectby Jonas Scmedtmann on Udemy. It”s one of the best and hand-son course to learn ES 6 and other new Javascript features.

JQuery Code to redirect a page or URL.

Here is the JQuery code for redirecting a page. Since I have put this code on $(document).ready() function, it will execute as soon as the page is loaded.

Xem thêm: Top 4 Cung Hoàng Đạo Giả Tạo Nhất Trên Đời, 12 Cung Hoàng Đạo

You can even pass URL directly to attr() method, instead of using a variable.

JavaScript Code for redirecting a URL


It”s even simpler in JavaScript. You only need to change window.location.href property to redirect a page. Though some people also use window.location only, which is also fine. If you are curious about the difference between window.location and window.location.href, then you can see that later one is setting href property explicitly, while earlier one does it implicitly. Since window.location returns an object, which by default sets it”s .href property.
There is another way to redirect a page using JavaScript, replace() method of window.location object. You can pass a new URL to replace() method and it will simulate an HTTP redirect.By the way, remember that window.location.replace() method doesn”t put the originating page in the session history, which may affect the behaviour of the back button. Sometimes, it”s what you want, so use it carefully.

Xem thêm: “Ngỡ Ngàng” Nhan Sắc Của 12 Cung Hoàng Đạo Ve Dep, Ngắm Nhìn Vẻ Đẹp Chòm Sao Của 12 Cung Hoàng Đạo

HTML Example of Redirecting a Page or URL

Here is a complete HTML page, which uses the above method to redirect a page or URL. Since you can only use one method at a time, I have commented rest of the code for redirection. You can uncomment and try them as well.

Related Post

Leave a Reply

Your email address will not be published. Required fields are marked *