Html代码是:
<div id="questions">
<ul>
<li class="selected"><a href="#fly">Fly</a></li>
<li><a href="#fly1">Fly 1</a></li>
</ul>
<div id="fly" style="display: block;">
<div id="question141">
<div id="question104">
<div id="question80">
<div id="question79">
</div>
<div id="fly1">
<div id="question141">
<div id="question104">
<div id="question80" >
<div id="question79" >
</div>
</div>
jQuery的:
<script>
jQuery(document).ready(function(){
jQuery('#questions div').hide();
jQuery('#questions div:first').show();
jQuery('#questions ul li:first').addClass('active');
jQuery('#questions ul li a').click(function(){
jQuery('#questions ul li').removeClass('active');
jQuery(this).parent().addClass('active');
var currentTab = jQuery(this).attr('href');
jQuery('#questions div').hide();
jQuery(currentTab).show();
return false;
});
});
</script>
上面的代码有两个标签,我使用jQuery显示点击标签。但是当我点击任何标签时。选项卡内的元素不显示。难道我做错了什么?
答案 0 :(得分:1)
所有这些问题div都是未公开的......关闭它们然后你的代码就可以了
你的代码对我有用......为什么你认为它没有?这是一个你可以看到的jsfiddle。单击链接时,将显示不同的选项卡。
使用此HTML查看它是否适用于您当前的JavaScript
<div id="questions">
<ul>
<li class="selected"><a href="#fly">Fly</a></li>
<li><a href="#fly1">Fly 1</a></li>
</ul>
<div id="fly" style="display: block;">
fly........
</div>
<div id="fly1">
fly1
</div>
</div>
答案 1 :(得分:1)
你做了很多事错误。
在jQuery UI标签上演示:http://jsfiddle.net/Qj23q/
答案 2 :(得分:0)
当你说jQuery('#questions div')。hide()或show()时,它会隐藏#questions div中的所有div。请尝试以下代码,它将适合您。
<script>
jQuery(document).ready(function(){
jQuery('#questions > div').hide();
jQuery('#questions div:first').show();
jQuery('#questions ul li:first').addClass('active');
jQuery('#questions ul li a').click(function(){
jQuery('#questions ul li').removeClass('active');
jQuery(this).parent().addClass('active');
var currentTab = jQuery(this).attr('href');
jQuery('#questions > div').hide();
jQuery(currentTab).show();
return false;
});
});
</script>