Question

我页面上多个标签的代码（动态显示这些标签和内容）：

jQuery('.tab-block li a').click(function() {
var theitem = jQuery(this);
theitem.parent().parent().find("li").removeClass("active");
theitem.parent().addClass("active");
theitem.parent().parent().parent().parent().find(".tab-content > ul > li").removeClass("active");
theitem.parent().parent().parent().parent().find(".tab-content > ul > li").eq(theitem.parent().index()).addClass("active");
return false;
});

我的HTML中的代码显示标签：

<div class="tab-block">
<div class="tabs">
    <ul>
<li class="active"><a href="#">TAB 1</a></li>
<li><a href="#">TAB 2</a></li>
</ul>
<div class="clear-float"></div>
</div>
<div class="tab-content">
<ul>
<li class="active">
<p><h3><a href="http://www.google.com/" rel="nofollow" target="_blank">Goole.com</a></h3></a>
<p>Content</p>
</li>
<li>
<p><h3><a href="http://www.google.com/" rel="nofollow" target="_blank">Goole.com</a></h3></a>
<p>Content</p>
</li>
</ul>
</div>
</div>

现在所有选项卡都运行良好但没有链接打开（标签本身内的H3链接）。我有什么想法我做错了吗？谢谢。

Answer 1

我不知道你的具体问题是什么，你可能想提供一个jsfiddle的链接，让自己清楚，但如果你需要标签，请尝试EZ tabs jQuery插件。

HTML：

<div class="tab-block">
  <div class="tabs">
    <ul class='nav'>
      <li>TAB 1</li>
      <li>TAB 2</li>
    </ul>
    <div class="clear-float"></div>
  </div>
  <div class="tab-content">
    <div class='box'>
      <p>
      <h3><a href="http://www.google.com/" rel="nofollow" target="_blank">Goole.com</a></h3>
      </a>
      <p>Content</p>
    </div>
    <div class='box'>
      <p>
      <h3><a href="http://www.google.com/" rel="nofollow" target="_blank">Goole.com</a></h3>
      </a>
      <p>Content</p>
    </div>
  </div>
</div>

jQuery，准备好文档：

$('.tab-block').eztabs({
    tabsList : 'ul.nav',
    animation: 'slideLeftRight',
    boxContainer: '.tab-content',
    animationTime: 200
});

jsfiddle

使用多个选项卡时，链接无法打开（Jquery选项卡）

1 个答案: