JS重定向详解

一、JS重定向URL

URL是指定位于因特网上某一台计算机的完整地址，如果需要在JS中进行重定向到指定的URL，则可以使用以下代码：

window.location.href="http://www.example.com";

上面的代码将当前页面重定向到指定的URL上。

也可以将重定向的URL存储在变量中：

var url = "http://www.example.com";
window.location.href=url;

在实际应用中，有时还需要在URL后面添加参数，可以通过以下方式实现：

var url = "http://www.example.com?id=123";
window.location.href=url;

二、JS重定向不显示中间地址

在进行JS重定向时，有时会遇到显示中间地址的问题，可以通过以下方式解决：

window.location.replace("http://www.example.com");

上面的代码将当前页面重定向到指定的URL上，并且不会在浏览器历史记录中留下记录。

三、JS重定向JS

有时候需要在JS中对JS进行重定向，可以使用以下代码实现：

setTimeout(function(){
    window.location.href="http://www.example.com"
},3000);

上面的代码表示在3秒之后将当前页面重定向到指定的URL上。

四、JS重定向跳过当前页

有时希望重定向跳过当前页，可以通过以下方式实现：

window.location.replace("http://www.example.com");

如果是从指定页面跳转到目标页面，则可以使用以下代码：

var referer = document.referrer;
if(referer.indexOf("http://www.example.com")!=-1){
    window.location.replace("http://www.example1.com");
}
else{
    window.location.replace("http://www.example2.com");
}

上面的代码表示如果从example.com跳转到example1.com，否则跳转到example2.com。

五、JS重定向页面

假设我们有一个页面需要重定向到另一个页面，并且需要保留当前页面中的所有数据，可以通过以下方式实现：

function redirect(){
    var form = document.createElement("form");
    form.setAttribute("method", "post");
    form.setAttribute("action", "http://www.example.com");
    var input = document.createElement('input');
    input.setAttribute("name", "data");
    input.setAttribute("value", "redirect");
    form.appendChild(input);
    document.body.appendChild(form);
    form.submit();
}

上面的代码创建一个表单，并将需要保留的数据作为表单中的参数，然后提交表单。

六、JS重定向做免登陆

在一些网站中，用户登录后需要进行redirect操作，但是有些网站需要登录之后才能看到需要重定向的内容。此时可以通过以下方式实现：

if(!isLogin()){
    window.location.href="http://www.example.com/login.html";
}
else{
    window.location.href="http://www.example.com/page.html";
}
function isLogin(){
    var token = localStorage.getItem("token");
    if(token){
        return true;
    }
    else{
        return false;
    }
}

上面的代码表示如果用户没有登录，则重定向到登录页，否则跳转到目标页面。

七、JS重定向和转发

JS重定向和转发的区别在于，重定向是完全重新载入一个页面，而转发则是只改变页面的URL地址。

下面是重定向的代码实例：

window.location.href="http://www.example.com";

下面是转发的代码实例：

history.pushState({},"","http://www.example.com");

八、JS重定向页面的方法

除了以上介绍的方式，还有以下几种JS重定向页面的方法：

使用history.back()返回上一页。
使用history.forward()前进到下一页。
使用location.reload()重新载入当前页。
使用location.hash定位到指定元素的位置。

九、JS重定向登录验证

在一些后台管理系统中需要进行登录验证，假设我们有一个需要登录验证的页面，可以通过以下方式实现：

if(!isLogin()){
    window.location.href="http://www.example.com/login.html";
}
else{
    //进行相应操作
}
function isLogin(){
    var token = localStorage.getItem("token");
    if(token){
        return true;
    }
    else{
        return false;
    }
}

上面的代码表示如果用户没有登录，则重定向到登录页，否则进行相应操作。

十、JS重定向浏览器地址选取

在一些需要上传文件的系统中，需要选择文件后重定向到指定页面，并附带文件路径，可以通过以下方式实现：


function redirect(obj){
    var file = obj.files[0];
    var url = "http://www.example.com?file="+encodeURIComponent(file.webkitRelativePath);
    window.location.href = url;
}

上面的代码表示在选择文件后获取文件路径，并将其作为参数附加在URL中，然后进行重定向。

原创文章，作者：小蓝，如若转载，请注明出处：https://www.506064.com/n/295462.html