Javascript 改变url地址 不跳转

admin

如果不使用html5是没有办法实现的，但是我们可以使用hash来实现类似的功能。

首先说一下我想要实现的：

在一个页面点击一个连接，然后打开新页面，并根据url的参数调用相应的js方法，打开一个Extjs中的panel或者window。

很多人觉得没必要改变url但是不跳转，这里我说一样需要这么做的原因，因为打开新的页面后地址有参数了，如果点击刷新按钮，则一定会再次调用js的方法，我们不希望这么做，在页面打开并调用js方法完成后把参数清空，防止刷新是再次调用js方法。

如果不使用html5是不能实现的，也是出于安全考虑，所以如果要实现和我描述的类似的功能，可以使用hash实现类似效果。

 

1、首先，修改要打开的url：

比如以前的url为：

http://liuchang:8080/cas/login?a=action&c=java&r=123

我们修改为：

http://liuchang:8080/cas/login#a=action&c=java&r=123

2、然后再新打开的页面获取 “#” 后面的参数：

js获取url参数：

JavaScript 获取URL参数

我们需要对这个方法做一下修改：

/**
 * 参数
 * @type {Object}
 */
var Param = {
    // 获取所有参数，返回Object类型，然后根据参数名获取对应的参数值
    urlArgs :function(){
        var url = location.hash; // 参数
            str = '',
            params = {};
             
        if(url.indexOf('#') != -1){
            str = url.substr(1);
        }else{
            return null;
        }
        strs = str.split('&');
        for(var i = 0; i < strs.length; i++){
            var sub = strs[i].split('=');
            params[sub[0]] = unescape(sub[1]);
        }
        return params;
    }
}

到此我们已经取到我们想要的参数了，接下来就可以做其他的操作了。

 

3、重置url，也就是要删除参数，防止刷新时调用js：

location.hash = "";	// 重新设置url

换种思路也可以解决问题。需要的同学可以试一下这种方式。

声明一点：IE下，在新打开窗口中不支持特殊符号的hash。firefox和chrome测试没问题。

发表评论