Question

我有这个简单的js标签。

这是html：

<div class="product-collateral">
    <div class="tab">
      <h3 class="product_tabs_agenda">Tab 1</h3>
    </div>
    <div class="product-tabs-content" id="product_tabs_agenda_contents">
      <p>Tab1 Content</p>
    </div>
    <div class="tab">
      <h3 class="product_tabs_terms">Terms and Conditions</h3>
    </div>
    <div class="product-tabs-content" id="product_tabs_terms_contents">
      <p>Some terms and conditions</p>
    </div>
</div>

java如下：

< script type = "text/javascript" > $jQ('.product-collateral .tab h3').wrapAll('<ul class="product-tabs"></ul>').wrap('<li></li>');
$jQ('.product-collateral .product-tabs li').each(function(index) {
    $jQ(this).attr('id', $jQ(this).find('h3').attr('class'));
    if (index == 0) $jQ(this).addClass('active');
});
//<![CDATA[
Varien.Tabs = Class.create();
Varien.Tabs.prototype = {
    initialize: function(selector) {
        var self = this;
        $$(selector + ' h3').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');
//]]>
< /script>

除互联网曝光者外，这些标签工作正常。我试图在代码中找到错误 - 遗憾的是没有成功。

非常感谢。

非常感谢提前！

的Dom

Answer 1

选择H3时，你有两个$ ...

initialize: function(selector) {
        var self = this;
        $$(selector + ' h3').each(this.initTab.bind(this));
    },

Answer 2

也许这条线是罪魁祸首？你有2 $$

$$(selector + ' h3').each(this.initTab.bind(this));

Answer 3

我的标签在IE 9中不断消失。

他们碰巧嵌套在一个表格单元格中。一旦我将它们从单元格中取出，它们就不再具有IE 9问题了。

IE 9中的jQuery选项卡无法正常工作

3 个答案: