代码之家 › 专栏 › 技术社区 › Tomas Andrle

Javascript从#锚定重定向到单独页面

anchor redirect javascript

Tomas Andrle · 技术社区 · 15 年前

旧链接样式:

/all_products#A
/all_products#B
/all_products#C

/products/A
/products/B
/products/C

是否可以使用Javascript自动从/all#u products#A重定向到/products/A?

JQuery就可以了,反正它已经在网站上使用了。

5 回复 | 直到 15 年前

janpio WillBroadbent 6 年前

我添加了这个新的答案,以包括这两方面的一些最佳实践 extracting the hash from the url 和 doing a redirect .

// Closure-wrapped for security.
(function () {
    var anchorMap = {
        "A": "/products/A",
        "B": "/products/B",
        "C": "/products/C"
    }
    /*
    * Best practice for extracting hashes:
    * https://stackoverflow.com/a/10076097/151365
    */
    var hash = window.location.hash.substring(1);
    if (hash) {
        /*
        * Best practice for javascript redirects: 
        * https://stackoverflow.com/a/506004/151365
        */
        window.location.replace(anchorMap[hash]);
    }
})();

James Wheare 15 年前

将其放在HTML的顶部 <head> 尽可能使其在下载其余页面资源之前执行:

<script>
function checkURL() {
    var old_path = '/all_products';
    if (window.location.pathname != old_path) {
        // Not on an old-style URL
        return false;
    }
    // Some browsers include the hash character in the anchor, strip it out
    var product = window.location.hash.replace(/^#(.*)/, '$1');
    // Redirect to the new-style URL
    var new_path = '/products';
    window.location = new_path + '/' + product;
}
checkURL();
</script>

这将检查当前页面URL,并重定向它是否与旧式路径匹配。

window.location 对象,该对象包含当前URL的所有部分,这些部分已拆分为多个组件。

Gregory 15 年前

var urlSplit = document.URL.split("#");
if (urlSplit[1]) {
    location.href = "http://www.example.org" + "/" + urlSplit[1];
}
else {
    location.href = "http://www.example.org";
}

kkyy 15 年前

使用jquery,只需将href替换为正确的href即可:

$('a').each(function() {
  this.href = this.href.replace(/all_products#/, 'products/');
});

或捕获单击并重定向:

$('a').click(function() {
  window.location = this.href.replace(/all_products#/, 'products/');
  return false;
});

-1

TheVillageIdiot 15 年前

<a href="/all_products#A" onclick="return redirectMe(this);">A</a>
<a href="/all_products#B" onclick="return redirectMe(this);">B</a>
<a href="/all_products#C" onclick="return redirectMe(this);">C</a>
<a href="/all_products#D" onclick="return redirectMe(this);">D</a>
<a href="/all_products#E" onclick="return redirectMe(this);">E</a>

<script type="text/javascript">
function redirectMe(a){
   var aa=a+"";
   window.location=aa.replace(/#/g,"/");
}
</script>

推荐文章

Maddison · 如果用户选择18岁以下,则需要表单重定向用户

2 年前

subash web · Iam在django中重定向模板时传递值

2 年前

Joesph Stah Lynn · 反应窗口的版本。地方替换()?

2 年前

July333 · 从localhost的第二个窗口登录时,LocalStorage中的数据会被覆盖

6 年前

John Rogerson · 使用模式名+RedirectVew从Django中的另一个应用程序调用URL名

6 年前

P S · 在laravel 5.5中输入不起作用时重定向回

6 年前

kebie · Django:如果url是由用户手动写入的,则重定向

6 年前

Ashy Ashcsi · Reactjs从操作重定向

6 年前

Tonye Boro · 用户注销后未重新搜索回上次访问的页面

6 年前

Pavel Nedev · 表单提交时的PHP重定向无效

6 年前