Javascript 如何使用JTAB链接到选项卡？

我使用本网站上的步骤将选项卡添加到我正在处理的页面的某个部分（stripertechnologies.com/stoutwebsite/products.php）：

我想从主页链接到不同的选项卡，但我不确定如何使用html在锚名称之外进行链接，这不适用于此，而且网站上也没有任何关于如何进行链接的说明

似乎应该有一些非常简单的东西可以添加到我的javascript中，以检测他们点击了哪个链接，并使其成为活动选项卡

javascript:

;(function($){
  $.fn.html5jTabs = function(options){
    return this.each(function(index, value){
      var obj = $(this),
      objFirst = obj.eq(index),
      objNotFirst = obj.not(objFirst);

      $("#" +  objNotFirst.attr("data-toggle")).hide();
      $(this).eq(index).addClass("active");

      obj.click(function(evt){

        toggler = "#" + obj.attr("data-toggle");
        togglerRest = $(toggler).parent().find("div");

        togglerRest.hide().removeClass("active");
        $(toggler).show().addClass("active");

        //toggle Active Class on tab buttons
        $(this).parent("div").find("a").removeClass("active");
        $(this).addClass("active");

        return false; //Stop event Bubbling and PreventDefault
      });
    });
  };
}(jQuery));

---

像这样的怎么样？基本上，我们在按钮中获取数据切换的值，并将其传递给每个选项卡内容的选择器

JS

工作示例：

---

这个答案来自一个重复的问题：

您可以从链接中传递url中的tab div id，并使用该id进行选择

index.html中的主页链接：

<a href="products.php?tabId=tile">tile</a>
<a href="products.php?tabId=metal">metal</a>

---

术语问题：它是“javascript”（或js，缩写）；不是jscript（微软的东西）或java脚本（不存在）。这听起来可能是吹毛求疵，但说到技术，直呼其名是一件相当重要的事情。也就是说，stackoverflow是为您提供的，一旦您找到了一种方法来做某事，开始做，然后陷入困境。在你开始之前，这并不是一个好去处，所以：谷歌搜索一些JS教程，试试看，一旦你遇到了特定的代码问题，这里也会为你提供帮助。如果你能给我们展示一些你迄今为止尝试过的代码，这里的人会更好地帮助你。耶！这是什么？重复？？我的选项卡工作正常，但无法从其他页面链接到特定选项卡。

<a href="products.php?tabId=tile">tile</a>
<a href="products.php?tabId=metal">metal</a>

<script type="text/javascript">
// To get parameter from url
function getParameterByName(name) {
    name = name.replace(/[\[]/, "\\\[").replace(/[\]]/, "\\\]");
    var regex = new RegExp("[\\?&]" + name + "=([^&#]*)"),
    results = regex.exec(location.search);
    return results == null ? "" : decodeURIComponent(results[1].replace(/\+/g, " "));
}

    $.extend($.expr[':'], {
    attrNameStart: function (el, i, props) {
        var hasAttribute = false;
        $.each(el.attributes, function (i, attr) {
            if (attr.name.indexOf(props[3]) !== -1) {
                hasAttribute = true;
                return false;
            }
        });


        return hasAttribute;
    }
});

// deselect tabs and select the tab by id
function focusTab(id) {
    $("#tile").hide().removeClass("active");
    $("#metal").hide().removeClass("active");
    $("#shingle").hide().removeClass("active");
    $("#flat").hide().removeClass("active");
    $("#custom").hide().removeClass("active");
    var toggle = $(id).parent().find("div");
    toggle.hide().removeClass("active");
    $('a:attrNameStart(data-toggle)').removeClass("active");
    var id1 = getParameterByName("tabId");
    var toggler = $('*[data-toggle=' + id1 + ']');        
    $(toggler).addClass("active");        
    $(id).show().addClass("active");
}

 $(function() {
    $(".tabs a").html5jTabs();

    // Get the tab id from the url
    var tabId = "#" + getParameterByName("tabId");
    // Focus the tab       
    focusTab(tabId);
});
</script>

<script type="text/javascript">
    $(function() {
        $(".tabs a").html5jTabs();
    });
</script>