Question

我有一些查询标签，它们运行良好。唯一的问题是它们内部的任何div也被显示隐藏：none css。

当然我想要它选择的是标签容器而不是内容，否则我必须手动添加display：inherit / box或者在标签内的每个div中显示它以便显示它。

这是jquery

$(document).ready(function(){
$('#tabs div').hide();
$('#tabs div:first').show();
$('#tabs ul li:first').addClass('active');

$('#tabs ul li a').click(function(){
$('#tabs ul li').removeClass('active');
$(this).parent().addClass('active');
var currentTab = $(this).attr('href');
$('#tabs div').hide();
$(currentTab).show();
return false;
});
});

HTML here

<div id="tabs">
   <ul>
     <li><a href="#tab-1">Overview</a></li>
     <li><a href="#tab-2">Facilities</a></li>
     <li><a href="#tab-3">Reviews</a></li>
     <li><a href="#tab-4">Images</a></li>
   </ul>
   <div id="tab-1">
     <h5>Overview</h5>
          <div id= table"></div>
   </div>
   <div id="tab-2">
     <h5>Facilities</h5>
    </div>

所以从上面我假设div被称为table将被隐藏，因为jquery正在选择父#tabs div内的所有div。当涉及到jquery时，我是一个完全的初学者，所以我不知道如何解决这个问题。

同样的说明。如何在每个标签上设置一个ancor，以便它可以通过url“跳转”到即www.example.com/pagewithtab/tab1name

谢谢你们。

Answer 1

我会在你的脚本中更改一些选择器。特别是包含#tabs div的那些，例如这个：

$('#tabs div').hide();

这一个：

$('#tabs div:first').show();

这里的选择器以#tabs中的所有子div为目标，但你可能只想要#tabs的直接后代。要定位，请使用>：

$('#tabs > div').hide();

和

$('#tabs > div:first').show();

jquery tabs display：none隐藏所有内部div

1 个答案: