需要链接到javascript程序的特定部分吗？

我有以下程序，基本上只是一个花哨的列表。但是，我需要通过网站其他页面上的链接链接到程序的特定部分。以下是该程序的外观：

下面是与程序相关的HTML和JavaScript：

<div id="container">
      <!--Horizontal Tab-->
      <div id="parentHorizontalTab">
          <ul class="resp-tabs-list hor_1">
              <li>Where are peanuts made?</li>
              <li>How are peanuts made?</li>
              <li>Do I like peanuts?</li>            
          </ul>
          <div class="resp-tabs-container hor_1">
              <div><p>This page consists of helpful peanuts</p></div>
      <div><p>
                      <!--vertical Tabs-->

                      <div id="ChildVerticalTab_1">
                          <ul class="resp-tabs-list ver_1">
                            <li>In what country are peanuts made?</li>
                            <li>How do they transport peanuts?</li>
                        </ul>
                        <div class="resp-tabs-container ver_1">
                            <div>
                                <p>Please refer to        <a>Page                       1</a>the             peanut guide, a bunch of random stuff about peanuts here
</p>
                            </div>

 $(document).ready(function() {
    //Horizontal Tab
    $('#parentHorizontalTab').easyResponsiveTabs({
        type: 'default', //Types: default, vertical, accordion
        width: 'auto', //auto or any width like 600px
        fit: true, // 100% fit in a container
        tabidentify: 'hor_1', // The tab groups identifier
        activate: function(event) { // Callback function if tab is switched
            var $tab = $(this);
            var $info = $('#nested-tabInfo');
            var $name = $('span', $info);
            $name.text($tab.text());
            $info.show();
        }
    });

    // Child Tab
    $('#ChildVerticalTab_1').easyResponsiveTabs({
        type: 'vertical',
        width: 'auto',
        fit: true,
        tabidentify: 'ver_1', // The tab groups identifier
        activetab_bg: '#fff', // background color for active tabs in this group
        inactive_bg: '#F5F5F5', // background color for inactive tabs in this group
        active_border_color: '#c1c1c1', // border color for active tabs heads in this group
        active_content_border_color: '#5AB1D0' // border color for active tabs contect in this group so that it matches the tab head border
    });

            $('#ChildVerticalTab_2').easyResponsiveTabs({
        type: 'vertical',
        width: 'auto',
        fit: true,
        tabidentify: 'ver_2', // The tab groups identifier
        activetab_bg: '#fff', // background color for active tabs in this group
        inactive_bg: '#F5F5F5', // background color for inactive tabs in this group
        active_border_color: '#c1c1c1', // border color for active tabs heads in this group
        active_content_border_color: '#5AB1D0' // border color for active tabs contect in this group so that it matches the tab head border
    });

所以本质上我们有一个垂直选择的表格布局，也有水平选择，在右边的窗口中显示一些东西。用户选择所需的水平主类别，然后在该类别下选择所需的特定问题，以在右侧框中显示答案

显然，我可以使用ID选择器链接到页面的特定部分。问题是，我需要自动打开涉及特定问题的特定选项卡和相应的侧选项卡

例如，我在另一个页面上有一个问题，问他们在哪个国家生产花生，当页面加载时，我希望页面加载打开“花生是如何生产的”选项卡，最好是“花生是在哪个国家生产的”垂直选项卡

我相信我的JavaScript中需要一个事件属性，只是不确定在这个场景中使用什么事件属性

---

显然，我遗漏了脚本的某些部分，有一些内容是我无法在这里发布的原因。另外，不在关于花生的网站上工作：

想法是在url的哈希部分放置所需的水平和垂直选项卡，如下所示：http://example.com/some/page1/2 其中，在本例中，1是水平选项卡的索引，2是垂直选项卡的索引。一般哈希模式将是{zero-based index}/{zero-based index}。加载文档时，解析url的哈希值，然后模拟单击哈希选择的选项卡（如果有）

<script>
$(document).ready(function() {
    var selectedTabs = getTabsFromHash(window.location.hash);
    if(!selectedTabs)  {
        return;
    }

    $('#parentHorizontalTab > ul > li:eq(' + selectedTabs.horizontalTab + ')').click();
    $('#ChildVerticalTab_1 > ul > li:eq(' + selectedTabs.verticalTab + ')').click();
});

function getTabsFromHash(hash)
{
  var matchedParts = /(\d+)\/(\d+)/i.exec(hash);
   if(matchedParts !== null){
      return {
         horizontalTab: matchedParts[1],
         verticalTab: matchedParts[2],
      };
   }

    return null;
}
</script>

请参见演示：