所以我有一个链接列表,当点击一个带内容的div应该显示时,很容易,但我的解决方案不工作,想法?尝试使用jQuery创建显示/隐藏切换内容?
而且我这个夹道注释掉,因为林不知道我需要这个,因为我已经隐藏,并通过改变他们的CSS类,(右?)
// $('').toggleClass(''); --- Not sure if I need this? AND how I'd use it?..
/* Service Panel - toggle */
(function($) {
$(document).ready(function() {
$(document).ready(function() {
// $('').toggleClass(''); --- Not sure if I need this? AND how I'd use it?..
$('#family-law-item').click(function() {
$(".hide-other-desc").css({
"display": "none"
});
$(".family-law-desc").css({
"display": "block"
});
});
$('#stock').click(function() {
$(".hide-other-desc").css({
"display": "none"
});
$(".criminal-law-desc").css({
"display": "block"
});
});
$('#workshop').click(function() {
$(".hide-other-desc").css({
"display": "none"
});
$(".corporate-law-desc").css({
"display": "block"
});
});
$('#all-courses').click(function() {
$(".hide-other-desc").css({
"display": "none"
});
$(".international-law-desc").css({
"display": "block"
});
});
});
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<section class="services-panel">
<nav class="services-items">
<li id="family-law-item"><a href="#"> Family Law</a></li>
<li id="criminal-law-item"><a href="#"> Criminal Law</a></li>
<li id="corporate-law-item"><a href="#"> Corporate Law</a></li>
<li id="international-law-item"><a href="#"> International Law</a></li>
</nav>
<div class="service-desc-wrap">
<article id="family-law-desc hide-other-desc">
aaaaaaaaaaaaaaaaaaaaaaaaaaaaLorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make
a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and
more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.<br>
</article>
<article id="criminal-law-desc hide-other-desc">
bbbbbbbbbbbbbbbbLorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen
book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently
with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.<br>
</article>
<article id="corporate-law-desc hide-other-desc">
ccccccccccccccccccLorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen
book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently
with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.<br>
</article>
<article id="international-law-desc hide-other-desc">
ddddddddddddddddddddddddddLorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a
type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and
more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.<br>
</article>
</div>
</section>
所以像这样吗? :\t \t $( “#家庭法项目”)点击(函数(){ \t \t \t $()切换(); \t \t “家庭法,递减。”}); – Shaz
一个例子将会是惊人的 – Shaz
两个问题:1.如果文章是一个id,链接元素也是一样吗? 2. toggleClass() - 为什么这不起作用,看起来就像它的“隐藏/显示”模式一样?仍在学习:) – Shaz