[英]Slide Up/Down with jQuery
我需要向上/向下滑动或仅显示和隐藏div,但它不起作用。 我的代码:
<div class="facilities">
<div id="facheader">
<div class="facheadname">
Facilities
</div>
<div class="facheaderbutton">
△
</div>
</div>
<div id="factable">
<table border="0">
<tr><div class="factableheader">
<th>Name</th><th>City</th><th>Country</th><th>Compliance Certification</th><th>Audit History</th><th>Date</th><th>Remediation History</th><th>Date</th></div>
</tr>
<tr>
<td>Kowloon</td><td>Hong Kong</td><td>Hong Kong</td><td>cGMP-FDA</td><td>Compliant cGMP-SeerPharma</td><td>12/12/10</td><td>Clean room staff training – IRB-C</td><td>01/03/05</td>
</tr>
</table>
</div>
</div>
我尝试了代码-它隐藏了内容,但再次按下时不显示:
$('#facheader').click(function(){
if ($('#factable').is(':hidden')){
$('#factable').show();}
else{
$('.contclickedinfo').hide();
}
return false;
});
$('#factable').click(function(e) {
e.stopPropagation();
});
$(document).click(function() {
$('#factable').hide();
});
我也尝试了这些,但是它们根本不起作用:
$(document).ready(function(){
$('#facheader').click(function(){
$('#factable').slideUp(), function(){
$('#factable').slideDown();
});
});
和
$('#facheader').toggle(function(){
$('#factable').slideUp(800); // Text slides up
}, function(){
$('#factable').slideDown(800); // Text slides down
});
$('#facheader').click(function() {
if ($('#factable').is(':visible'))
$('#factable').slideUp(800); // Text slides up
else
$('#factable').slideDown(800); // Text slides down
});
$('#facheader').click(function() {
if ($('#factable').is(':visible')){
$('#factable').hide();
} else {
$('#factable').show();
}
return false;
});
那应该按照您想要的方式工作。 我更改了要隐藏的元素,因为您选择了其他元素。 此外, :visible
选择器比:hidden
提供更好的服务。 我不确定为什么:hidden
并不总是按照我们期望的方式工作。
带拨动功能的短裤
$("#facheader").click(function(){
$("#factable").slideToggle(); /* between () you can define speed in MS */
});
因为它不是触发幻灯片的链接,所以您不需要返回false或stopPropagation。
奇怪的是:
<tr><div class="factableheader">
当浏览器看到此内容时,它们会将您放在桌子外面。
您是否正在使用具有相同ID的多个DIV?
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.