我有这个标签用css和javascript隐藏对方:
<div class="accordionContent">
<div class="menusfondo">
<div class="content">
<ul class="tabs2">
<li><a href="#scheda4" id="uno">INTRODUZIONE</a></li>
<li><a href="#scheda5">FILOSOFIA</a></li>
<li><a href="#scheda6">CASI DI SUCCESSO</a></li>
<li><a href="#scheda7">ULTIME INNOVAZIONI</a></li>
<li><a href="#scheda8">CONTATTI</a></li>
</ul>
<div class="contenitore_tab2">
<div id="scheda4" class="contenuto_tab2">
<h1>title</h1>
<h2>title2</h2>
<p>content <a href="#scheda5">link scheda 5</a>. content</p>
</div>
<div id="scheda5" class="contenuto_tab2">
<h1> title</h1>
<h2> title2</h2>
<p>content</p>
</div>
<div id="scheda6" class="contenuto_tab2">
<h1>title</h1>
<h2>title2 </h2>
<p>content</p></div>
<div id="scheda7" class="contenuto_tab2">
<h1>title</h1>
<h2>title2</h2>
<p>content</p></div>
</div>
</div>
</div>
</div>
</div>
<div id="wrapper2">
<div class="accordionButton uno"><div class="content">
<h1>title</h1>
</div>
<div id="hidden"></div></div>
<div class="accordionContent ">
<div class="menusfondo">
<div class="content">
<ul class="tabs">
<li><a href="#scheda1">INTRODUZIONE</a></li>
<li><a href="#scheda2">FILOSOFIA</a></li>
<li><a href="#scheda3">NEGOZIO ONLINE</a></li>
<li><a onclick="window.open('http://www.eurotesterpen.com/contact','_blank');">CONTATTI</a></li>
</ul>
<div class="contenitore_tab">
<div id="scheda1" class="contenuto_tab">
不起作用的锚在div“scheda4”内。它与每个选项卡的菜单中的链接完全相同,但我不确定是否应该将其链接到javascript以使其工作。 javascript是:
$(document).ready(function() {
$(".contenuto_tab2").hide(); //Nascondo tutti i contenuti
$("ul.tabs2 li:first").addClass("active").show(); //Attivo il primo tab
$(".contenuto_tab2:first").show(); //Mostro il primo contenuto (contenuto del primo tab)
$("ul.tabs2 li").click(function() {
$("ul.tabs2 li").removeClass("active"); //Rimuovo tuttle le classi "active"
$(this).addClass("active"); //Attivo il tab selezionato
$(".contenuto_tab2").hide(); //Nascondo tutti i contenuti
var tabAttivo = $(this).find("a").attr("href"); //Prendo il valore dell'attributo href del tab per attivare il realtivo contenuto
$(tabAttivo).fadeIn(); //Faccio un Fade in per mostrare il contenuto dell'ID appena trovato
return false;
});
});
为什么我点击它时没有显示正确的标签(scheda 5)?点击的效果是无,页面保持不变。请你能给我一些帮助吗?
答案 0 :(得分:0)
我做过这样的事情:
<div id="scheda4" class="contenuto_tab2">
<h1>title</h1>
<h2>title2</h2>
<p class="link">content <a href="#scheda5">link scheda 5</a>. content</p>
</div>
然后在javascript中,在文档就绪函数内部:
$("p.link").click(function() {
$("ul.tabs2 li").removeClass("active"); //Rimuovo tuttle le classi "active"
$('ul.tabs2 li a[href="#scheda5"]').addClass("active"); //Attivo il tab selezionato
$(".contenuto_tab2").hide(); //Nascondo tutti i contenuti
var tabAttivo = $(this).find("a").attr("href"); //Prendo il valore dell'attributo href del tab per attivare il realtivo contenuto
$(tabAttivo).fadeIn(); //Faccio un Fade in per mostrare il contenuto dell'ID appena trovato
return false;
});
除了这一行之外它实际上有效:
$('ul.tabs2 li a[href="#scheda5"]').addClass("active"); //Attivo il tab selezionato
但我真的不明白为什么......