Javascript 语义用户界面-选项卡/显示URL

希望有人能帮忙

我使用的是SUI的tab组件，一切都很好，但是当点击这些选项卡时，我希望URL改变以反映每个选项卡，这样它们就可以在google analytics中单独跟踪。它是一个单页应用程序，主页结构加载为/dashboard，每个选项卡在单击时从/dashboard/数据选项卡名称远程加载，但url仅在浏览器中显示/dashboard-因此，google analytics仅拾取一个url，而应用程序上有5个单独的选项卡

如何更改设置以使url反映正在查看的选项卡

HTML:

电力
昨天
平衡
有历史意义的
社区
项目编号：

JS:

$（'#infotabs.menu.item'）
.标签({
EvaluateScript：正确，
是的，
路径：'/dashboard/'，
ignoreFirstLoad:false，
总是新鲜的：错，
onRequest:function（）{
var panel=document.getElementById（'load-panel'）；
如果（panel.innerHTML==''）{
panel.innerHTML='正在加载数据-可能需要几秒钟的时间…'
}
},
onLoad:function（）{
var panel=document.getElementById（'load-panel'）；
panel.innerHTML=“”
}
});
$（'#infotabs.menu.item'）.tab（'change tab'，'live'）；

---

提前感谢您的帮助。

我找到了答案，使用Asual地址库（V1.5）并将jQuery版本降级到1.8.3，1.9及更高版本不受支持：

<script src="https://code.jquery.com/jquery-1.8.3.min.js" integrity="sha256-YcbK69I5IXQftf/mYD8WY0/KmEDCv1asggHpJk1trM8=" crossorigin="anonymous"></script>
<script src="/js/jquery.address-1.5.js" type="text/javascript"></script> 

在JS设置历史和历史类型中：

  $('#infotabs .menu a.item')
      .tab({
        evaluateScripts : true,
        auto: true,
        path: '/dashboard/',
        history: true,
        historyType: 'hash',
        ignoreFirstLoad: false,
        alwaysRefresh: true,
        onRequest: function(){
          var panel = document.getElementById('loading-panel');
            if(panel.innerHTML === '') {
            panel.innerHTML = '<h3 class=\"loader-message\">Loading data - may take a few seconds...</h3>'
            }
        },
        onLoad: function(){
          var panel = document.getElementById('loading-panel');
          panel.innerHTML = ''
        }
      });

$（'infotabs.menu a.item'）
.标签({
EvaluateScript：正确，
是的，
路径：'/dashboard/'，
历史：没错，
historyType:'哈希'，
ignoreFirstLoad:false，
总是新鲜的：是的，
onRequest:function（）{
var panel=document.getElementById（'load-panel'）；
如果（panel.innerHTML==''）{
panel.innerHTML='正在加载数据-可能需要几秒钟的时间…'
}
},
onLoad:function（）{
var panel=document.getElementById（'load-panel'）；
panel.innerHTML=“”
}
});

然后可以配置Google analytics来识别哈希历史URL，例如/dashboard#/live、/dashboard#/Dayed等

<script src="https://code.jquery.com/jquery-1.8.3.min.js" integrity="sha256-YcbK69I5IXQftf/mYD8WY0/KmEDCv1asggHpJk1trM8=" crossorigin="anonymous"></script>
<script src="/js/jquery.address-1.5.js" type="text/javascript"></script> 

  $('#infotabs .menu a.item')
      .tab({
        evaluateScripts : true,
        auto: true,
        path: '/dashboard/',
        history: true,
        historyType: 'hash',
        ignoreFirstLoad: false,
        alwaysRefresh: true,
        onRequest: function(){
          var panel = document.getElementById('loading-panel');
            if(panel.innerHTML === '') {
            panel.innerHTML = '<h3 class=\"loader-message\">Loading data - may take a few seconds...</h3>'
            }
        },
        onLoad: function(){
          var panel = document.getElementById('loading-panel');
          panel.innerHTML = ''
        }
      });