深度链接基础5个选项卡 [英] Deep Linking Foundation 5 Tabs

问题描述

更新

Update

截至 v5.5.1 Foundation选项卡支持深度链接.

As of v5.5.1 Foundation Tabs support deep linking.

深层链接不适用于Foundation 5 Tabs，因此我正在尝试进行修改.

Deep linking doesn't work with Foundation 5 Tabs so I am attempting to work on a hack.

我的想法是使用jQuery触发相应选项卡上的单击，但它不起作用.

My thought is to use jQuery to trigger a click on the appropriate tab but it isn't working.

var hash = window.location.hash;
$(function() {
  $(window).on('load', function () {
    $(hash).trigger( "click" );
    console.log(hash)
  });
});

console.log显示正确的哈希值，但单击"似乎无效.

The console.log shows the correct hash but the "click" doesn't appear to work.

我想知道使我能够深层链接Foundation 5选项卡的任何变通方法或黑客程序.

I would like to know any workarounds or hacks that allow me deep link Foundation 5 Tabs.

推荐答案

Foundation 5现在通过属性data-options="deep_linking:true"

This is now supported as standard by Foundation 5 via the attribute data-options="deep_linking:true"

从文档:

选项卡Foundation组件可以解析位置哈希值并打开相应的选项卡内容窗格.要启用深度链接，请设置data-options ="deep_linking:true".如果位置哈希映射到选项卡内容窗格中的元素ID，则相应的选项卡将变为活动状态，并且浏览器窗口将滚动到指定的元素.如果您不想滚动到指定的元素，则设置data-options ="scroll_to_content:false".

The tabs Foundation component can parse the location hash value and open the corresponding tab content pane. To enable deep linking set data-options="deep_linking:true". If the location hash maps to an element ID within a tab content pane, then the appropriate tab will become active and the browser window will scroll to the specified element. If you do not want to scroll to the specified element then set data-options="scroll_to_content: false".

这篇关于深度链接基础5个选项卡的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！