Magento企业标签-如何选择链接中的特定标签? [英] Magento Enterprise Tabs - How to select specific tab in link?

问题描述

我正在尝试链接到Magento Enterprise中的特定选项卡.我发现的所有答案似乎都不适用于他们的方法.我只需要指向该页面的链接即可拉出特定的标签.这是他们使用的代码:

I am trying to link to a specific tab in Magento Enterprise. It seems that all of the answers I've found don't apply well to their method. I just need a link to the page to also pull up a specific tab. This is the code they use:

Enterprise.Tabs = Class.create();
Object.extend(Enterprise.Tabs.prototype, {
 initialize: function (container) {
    this.container = $(container);
    this.container.addClassName('tab-list');
    this.tabs = this.container.select('dt.tab');
    this.activeTab = this.tabs.first();
    this.tabs.first().addClassName('first');
    this.tabs.last().addClassName('last');
    this.onTabClick = this.handleTabClick.bindAsEventListener(this);
    for (var i = 0, l = this.tabs.length; i < l; i ++) {
        this.tabs[i].observe('click', this.onTabClick);
    }
    this.select();
},
handleTabClick: function (evt) {
    this.activeTab = Event.findElement(evt, 'dt');
    this.select();
},
select: function () {
    for (var i = 0, l = this.tabs.length; i < l; i ++) {
        if (this.tabs[i] == this.activeTab) {
            this.tabs[i].addClassName('active');
            this.tabs[i].style.zIndex = this.tabs.length + 2;
            /*this.tabs[i].next('dd').show();*/
            new Effect.Appear (this.tabs[i].next('dd'), { duration:0.5 });
            this.tabs[i].parentNode.style.height=this.tabs[i].next('dd').getHeight() + 15 + 'px';
        } else {
            this.tabs[i].removeClassName('active');
            this.tabs[i].style.zIndex = this.tabs.length + 1 - i;
            this.tabs[i].next('dd').hide();
        }
    }
}
});

有人有主意吗?

推荐答案

我会考虑修改类的启动方式.

I would consider modifying how the class starts up.

initialize: function (container) {
    this.container = $(container);
    this.container.addClassName('tab-list');
    this.tabs = this.container.select('dt.tab');
// change starts here //
    var hashTab = $(window.location.hash.slice(1));
    this.activeTab = ( this.tabs.include(hashTab) ? hashTab : this.tabs.first());
// change ends here //
    this.tabs.first().addClassName('first');
    this.tabs.last().addClassName('last');
    this.onTabClick = this.handleTabClick.bindAsEventListener(this);
    for (var i = 0, l = this.tabs.length; i < l; i ++) {
        this.tabs[i].observe('click', this.onTabClick);
    }
    this.select();
}

在这里，我只更改了初始标签的选择方式.它会检查 URL片段(通常称为哈希)，如果它标识了预先选择的选项卡之一.另外，如果可能，浏览器还将滚动到该元素.

Here, I have only changed how the initial tab is chosen. It checks for an URL fragment which is commonly known as a hash, if that identifies one of the tabs it is preselected. As a bonus the browser will also scroll to that element if possible.

然后，您只需要将选项卡的ID附加到URL.例如，您可以通过以下方式生成网址:

Then you only need to append the tab's ID to the URL. For example you might generate the URL by;

$productUrl = Mage::getUrl('catalog/product/view', array(
    'id' => $productId,
    '_fragment' => 'tab_id',
));

这篇关于Magento企业标签-如何选择链接中的特定标签?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！