Question

我正在使用Magento来构建店面 - 我不习惯Prototype，但这是他们默认使用的，所以我试着玩得很好。我使用了Modern主题中提供的标签设置（由Magento团队建立），我已将它集成到我的主题中，效果很好。

我需要帮助的地方是直接链接到特定标签 - 我已经创建了一个标签来存放产品评论，并且工作正常，但页面上的链接更高，链接到评论 - 但是，它们是链接到另一个页面，我宁愿不使用。我不熟悉正在使用的原型，我不知道链接到标签的链接是什么样的 - 我希望体验类似于：

1）点击链接 2）点评标签打开，页面将您移动到它 - 就像一个普通的锚点。

标签的href值只是：

javascript:void(0);

运行该操作的javascript是：

    Varien.Tabs = Class.create();
    Varien.Tabs.prototype = {
      initialize: function(selector) {
        var self=this;
        $$(selector+' a').each(this.initTab.bind(this));
      },

      initTab: function(el) {
          el.href = 'javascript:void(0)';
          if ($(el.parentNode).hasClassName('active')) {
            this.showContent(el);
          }
          el.observe('click', this.showContent.bind(this, el));
      },

      showContent: function(a) {
        var li = $(a.parentNode), ul = $(li.parentNode);
        ul.select('li', 'ol').each(function(el){
          var contents = $(el.id+'_contents');
          if (el==li) {
            el.addClassName('active');
            contents.show();
          } else {
            el.removeClassName('active');
            contents.hide();
          }
        });
      }
    }
    new Varien.Tabs('.product-tabs');

我的猜测是我需要调用showContent函数并强制它使用评论标签，但我不太清楚如何做到这一点。如果有人能说清楚它，我会很感激。

感谢。

Answer 1

不完全是正确的答案，即它有点作弊，但我们通过使用jQuery的'click（）'函数来模拟选项卡点击来解决这个问题。

即给评论标签标题锚定了'tab-reviews-tab'的id，并在页面顶部的链接中添加了以下JS：

jQuery('#tab-reviews-tab').click();

显然，仅仅为此包含jQuery是愚蠢的，但是如果你已经将它用于其他东西，坚持你所知道的可以工作！

Answer 2

如果有人仍然对解决方案感兴趣，这里有一个相同问题的提示：

源链接http://www.magentocommerce.com/boards/viewthread/59930/#t262411

希望这可以帮到你。

Answer 3

您的问题的答案位于gist和ipaste。

以下是摘要：

您需要将varien.Tabs对象保存在var中，因此请将new Varien.Tabs('.product-tabs');替换为var csTabs = new Varien.Tabs('.product-tabs');

如果您只是这样做一次，只需创建链接：

<a href="#" onclick="javascript:csTabs.showContent($$('#product_tabs_email_or_other_id a')[0]);" >The Link</a>

如果您希望这样做，只需在Varien.Tabs中添加一个新方法（第75行）

openTab:  function(b) {
  var controlledLink = $$("#"+b+" a")[0];
  this.showContent(controlledLink);
}

现在你的链接就像这样：

<a href="#" onclick="javascript:csTabs.openTab('product_tabs_email');">Email</a>
<a href="#" onclick="javascript:csTabs.openTab('product_tabs_info');">Further Info</a>

使用Prototype直接链接到选项卡

3 个答案: