Question

我引用的以下代码构成了互联网，但它不起作用。为什么呢？

jquery代码：

 $(document).ready(function(){

        $(".tab:not(:first)").hide();
        $(".tab:first").show();

        $(".htabs a").click(function(){

         var stringref = $(this).attr("href").split("#")[1];

          $(".tab:not(#"+ stringref +')').hide();

          //fix 
          if(jQuery.browser.msie && jQuery.browser.version.substr(0,3)=="6.0"){

            $('.tab #'+stringref).show();
          }else{
            $("tab #"+stringref).fadeIn();
                return false;
          }
        });

html代码：

<ul class="htabs hide">
        <li><h2><a href="#design">Graphic design</a></h2></li>
        <li><h2><a href="#development">Development</a></h2></li>
        <li><h2><a href="#freebies">Freebies</a></h2></li>
    </ul>
    <div class="tabs">
        <div id="design" class="tab">
            <ul>
                <li><a href="#">TYpography</a></li>
                <li><a href="#">TYpoface</a></li>
                <li><a href="#">painting</a></li>
                <li><a href="#">Optical balance</a></li>
            </ul>           
        </div>


        <div id="development" class="tab">
            <ul>
                <li><a href="#">TYpography</a></li>
                <li><a href="#">TYpoface</a></li>
                <li><a href="#">painting</a></li>
                <li><a href="#">Optical balance</a></li>
            </ul>           
        </div>


        <div id="freebies" class="tab">
            <ul>
                <li><a href="#">TYpography</a></li>
                <li><a href="#">TYpoface</a></li>
                <li><a href="#">painting</a></li>
                <li><a href="#">Optical balance</a></li>
            </ul>           
        </div>



    </div>


$(this).attr("href").split("#")[1];  what't the meaning of this line? why it's one( [1])?

Answer 1

如果不确切知道什么是无效的......你的确在一行上缺少一个点：

$(document).ready(function(){

$(".tab:not(:first)").hide();
$(".tab:first").show();

$(".htabs a").click(function(){

 var stringref = $(this).attr("href").split("#")[1];

  $(".tab:not(#"+ stringref +')').hide();

  //fix 
  if(jQuery.browser.msie && jQuery.browser.version.substr(0,3)=="6.0"){

    $('.tab #'+stringref).show();
  }else{
    //$("tab #"+stringref).fadeIn(); // Missing a . on this line
    $(".tab #"+stringref).fadeIn(); // Added the .
        return false;
  }
});

Answer 2

错误在以下两行：

$('.tab #'+stringref).show();

和

$(".tab #"+stringref).fadeIn();

.tab应从两者中移除，因此您拥有：

$('#'+stringref).show();

和

$("#"+stringref).fadeIn();

Answer 3

$（本）.attr（的 “href”）分割（ “＃”）[1]。这条线的含义是什么？为什么它是一个（[1]）？

这是一个绑定到锚元素的click事件的函数，因此这指的是该元素。因此代码获取锚元素的href属性的值，通过'＃'符号拆分，然后在＃符号后面取部分。由于if-else部分

中的错误选择器，代码无法正常工作

$(".tab:not(:first)").hide();
    $(".tab:first").show();

    $(".htabs a").click(function(){

     var stringref = $(this).attr("href").split("#")[1];

      $("div.tab:not(#"+ stringref +')').hide();

      //fix 
      if(jQuery.browser.msie && jQuery.browser.version.substr(0,3)=="6.0"){

        $('#'+stringref).show(); //fixed selector
      }else{
        $("#"+stringref).fadeIn(); //fixed selector
      }
      return false;
    });

我的jquery选项卡代码出了什么问题？

3 个答案: