JAVASCRIPT:向URL添加锚hashtag,并重新加载

时间:2018-06-28 作者:Pablo Molina

我做了this Website 在两个内部页面中使用锚定链接。这是一个多语言网站,使用PolyLang。语言选择器位于网站右上角的浮动菜单中。

网站所有者希望使用语言选择器的交互页面功能。这意味着;在任何英文页面中,您单击语言选择器(西班牙语),该选择器将根据父菜单项“活动”中的子菜单将您带到等效(对等)页面。

工作精细,开箱即用,用于链接;但不适用于锚链。为此,我尝试了Apache。htaccess和PHP,但不起作用。JavaScript适用于this page 只有一个锚。我使用了:

窗口。地方replace将规范URL替换为URL末尾包含锚点#outdining的URL它工作正常。

之后,我意识到我必须对具有多个锚的页面进行类似的编程。因此,我意识到我制作的JavaScript将无法用于该页面,我需要的是一个从浏览器URL检索锚的函数,然后在URL的末尾包含检索到的锚;然后,重新加载功能将同样工作。

例如the page is located in the anchor #骑脚踏车兜风然后单击右上方的浮动菜单“Español”,相应的URL将为/es/actividades/;然后需要在末尾添加#循环锚点。

我使用的代码the working page 如下所示:

<script type="text/javascript">
window.location.replace("https://zuleta.com/outdoor-dining/#outdining");
</script>
<script type=\'text/javascript\'>
 (function()
 {
  if( window.localStorage ){
    if(!localStorage.getItem(\'firstReLoad\')){
     localStorage[\'firstReLoad\'] = true;
     window.location.reload();
    } else {
     localStorage.removeItem(\'firstReLoad\');
    }
  }
 })();
</script>   
请帮助找出代码,以便将URL中显示的锚动态添加到翻译后的URL端。

谢谢

1 个回复
最合适的回答,由SO网友:Sally CJ 整理而成

尝试以下操作:

jQuery( window ).on( \'hashchange\', function(){
    jQuery( \'.polylang-flags > .lang-item > a\' ).prop( \'hash\', location.hash );
} );
您可以在任何页面上使用上述代码,并且可以使用它来代替这两个代码片段:(不要忘记<script></script> 标签,尽管如此)

<script type="text/javascript">
window.location.replace("https://zuleta.com/outdoor-dining/#outdining");
</script>
<script type=\'text/javascript\'>
 (function()
 {
  if( window.localStorage ){
    if(!localStorage.getItem(\'firstReLoad\')){
     localStorage[\'firstReLoad\'] = true;
     window.location.reload();
    } else {
     localStorage.removeItem(\'firstReLoad\');
    }
  }
 })();
</script>
该代码将监视锚定(例如。#cycling) 在浏览器中更改。

所以如果你在this page 点击“活动”菜单项下的“循环”子菜单项,语言选择器链接将显示#cycling 附加到其href 价值或者简单地说,就是链接的URL。

结束

相关推荐

在函数中添加JavaScript的正确方法。php

我是WordPress的新手,我开发了一个代码,可以在小部件中单击带有某些样式的按钮后加载iframe。但是它破坏了模板的布局,我想知道如何将我的函数添加到模板中。<a id=\"fazer_pedido\" href=\"https://example.com\" onclick=\"document.getElementById(\'load-chat\'); this.style.cursor = \'default\'; this.style.opacity = \'0.1\