-3
我的jQuery代码有问题。我想单击属于该按钮的预览文本之一,另一个最终关闭。两个按钮显示两个不同的div
文本应该使用slideDown()
去掉,并使用slideUp()
消失。它如何适应它并没有造成混乱?
HTML:
<div class="ata-pdf-wrapper ata-btn-video">
<a title="Videos">
<span>Videos</span>
<span> </span>
</a>
</div>
<div class="ata-pdf-wrapper ata-btn-pdf">
<a title="Download PDF">
<span>Download</span>
<span> </span>
</a>
</div>
<br/>
<br/>
<div class="ata-media-wrapper">
<div class="ata-downloads">
<ul>
<li>
<a title="DQA (free)" href="http://www.ataccama.com/en/products/dq-analyzer/download.html">DQA (free)</a>
</li>
<li>
<a title="Product Sheet" href="http://www.ataccama.com/dq-analyzer-product-sheet">Product Sheet</a>
</li>
<li>
<a title="User Guide" href="https://ataccama.s3.amazonaws.com/documentation/9.x.x/DQA/Ataccama%20DQA%209%20User%20Guide.pdf">User Guide</a>
</li>
<li>
<a title="Frequently Asked Questions" href="https://ataccama.s3.amazonaws.com/documentation/9.x.x/DQA/DQA%209%20FAQ.pdf">Frequently Asked Questions</a>
</li>
</ul>
</div>
<div class="ata-videos">
<ul>
<li>
<a title="Creating a Profile" href="https://www.youtube.com/watch?v=WC_VZ5z5q3E">Creating a Profile</a>
</li>
<li>
<a title="Understanding Profiling Results" href="https://www.youtube.com/watch?v=2L35k080ovQ">Understanding Profiling Results</a>
</li>
<li>
<a title="Advanced Profiling" href="https://www.youtube.com/watch?v=nQGBYkTXNPc">Advanced Profiling</a>
</li>
<li>
<a title="Email Analysis" href="https://www.youtube.com/watch?v=u45G0yo9sE4">Email Analysis</a>
</li>
</ul>
</div>
</div>
的jQuery:
$(document).ready(function() {
$(".ata-pdf-wrapper.ata-btn-video").click(function(){
if ($(".ata-pdf-wrapper.ata-btn-video").hasClass("active")) {
$(".ata-media-wrapper").hide();
$(".ata-videos").fadeIn(500);
$(".entry-content").removeClass("shadow");
$(".ata-pdf-wrapper.ata-btn-video").removeClass("active");
} else{
$(".ata-pdf-wrapper.ata-btn-video").addClass("active");
$(".ata-media-wrapper").show();
$(".ata-videos").slideDown(500);
$(".entry-content").addClass("shadow");
};
});
$(".ata-pdf-wrapper.ata-btn-pdf").click(function(){
if ($(".ata-pdf-wrapper.ata-btn-pdf").hasClass("active")) {
$(".ata-media-wrapper").hide();
$(".ata-downloads").fadeIn(500);
$(".entry-content").removeClass("shadow");
$(".ata-pdf-wrapper.ata-btn-pdf").removeClass("active");
} else{
$(".ata-pdf-wrapper.ata-btn-pdf").addClass("active");
$(".ata-media-wrapper").show();
$(".ata-downloads").slideDown(500);
$(".entry-content").addClass("shadow");
};
});
});
的代码上jsFiddle。
张贴在问题本身你的代码,而不仅仅是一个外部链接。人们不应该离开这个网站,看看你的问题是什么 – charlietfl 2014-11-03 21:17:37