Question

的JavaScript

$('dl #last div #product-tabs-content').not(":first-child").hide();

使用此测试代码，它可以完美运行，但

 <dl class="last"><div class="product-collateral row-fluid">
   <constructob>
     <ul class="product-tabs">
       <li id="product_tabs_1" class="first active">
         <a href="javascript:void(0)" style="text-decoration: underline;">111</a>
       </li>
       <li id="product_tabs_product_3я" class="">
         <a href="javascript:void(0)">222</a>
       </li>
       <li id="product_tabs_2" class="last">
         <a href="javascript:void(0)">333</a>
       </li>
       <li id="product_tabs_капут" class="last">
         <a href="javascript:void(0)" style="text-indent: initial;">444</a>
       </li>
     </ul>
   </constructob>

   <div class="product-tabs-content5" id="product_tabs_маря_contents">555</div>
   <div class="product-tabs-content" id="product_tabs_маря_contents">1</div>
   <div class="product-tabs-content" id="product_tabs_product_неля_contents" style="display: none;">2</div>
   <div class="product-tabs-content" id="product_tabs_ганя_contents" style="display: none;">3</div>
   <div class="product-tabs-content" id="product_tabs_капут_contents" style="display: none;">4</div>

  </div>
<dl>

但是在我的实时网站上，这个脚本不起作用。

这是我的问题页面http://mociko.zupermarket.uz.ua/index.php/profitroli/profitrol.html

第一次，我认为这是nococflict.js问题，但当我在函数中设置$jq时，发生了任何事情。

问题可能出在class / ids架构中，但我对Java的了解非常纯粹，可以解决这个问题。

Answer 1

您正在选择ID，但您的HTML会显示包含这些名称的类，而不是ID。你是说这个吗？

$('dl .last div .product-tabs-content').not(":first-child").hide();

Answer 2

我看到你的网站上有这个：

<script type="text/javascript">
//<![CDATA[м
setTimeout(display,100);
function display() {
    $jq('dl #last div #product-tabs-content').not(":first-child").hide();

    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').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>

首先，您需要订购一点，您正在关闭＆＃34; //]]＆gt;＆＃34;在关闭支架之前，尝试以这种方式：

    ....
    }
    new Varien.Tabs('.product-tabs');
}
//]]>
</script>

然后你使用setTimeout来执行jquery，这并不能保证你所有的页面都被加载了，你也用0.1秒来执行它，基本上你没有给网站加载时间，你可以改变那个＆＃34; 100＆＃34;到＆＃34; 2000＆＃34;测试是否有效。无论如何，我认为你需要以比setTimeout更多的方式做到这一点，因为加载时间总是变量，你永远不知道页面将被加载的时间。所以你可以试试这个：

<script type="text/javascript">
//<![CDATA[м
$jq(document).ready(function () {
    $jq('dl #last div #product-tabs-content').not(":first-child").hide();

    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').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>

Answer 3

谢谢你们所有人。我通过这种方式修复了我的问题。

<script type='text/javascript'>//<![CDATA[ 
$jq(document).ready(function () {
$jq('.last .product-tabs-content').not("div:eq(0)").hide();
});//]]>  
</script>

在第一个孩子中没有显示

3 个答案: