Javascript 使用jQuery向上/向下滑动

我需要向上/向下滑动或只是显示和隐藏div，但它不起作用。我的代码：

<div class="facilities">
            <div id="facheader">
                <div class="facheadname">
                    Facilities
                </div>
                <div class="facheaderbutton">
                    &#9651;
                </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>

我也试过这些，但根本不起作用：

$(document).ready(function(){
    $('#facheader').click(function(){
        $('#factable').slideUp(), function(){
        $('#factable').slideDown();
    });
});

及

---

这应该是你想要的方式。我更改了要隐藏的元素，因为您选择了不同的元素。此外，

：visible

选择器比

：hidden

更适合我。我不知道为什么

：hidden

并不总是按照我们期望的方式工作。

使用切换功能简短介绍

$("#facheader").click(function(){
    $("#factable").slideToggle(); /* between () you can define speed in MS */
});

因为它不是触发幻灯片的链接，所以不需要返回false或stopPropagation

奇怪的是：

<tr><div class="factableheader">

当浏览器看到这一点时，他们会把你放在桌子外面

---

您是否使用具有相同ID的多个DIV？

我尝试了您的所有解决方案，但都不起作用。当我按下Facilities时，您可以在这里看到它。什么都没有发生：这是因为您的.Facilities有一个

z-index:-1

，这使得它无法单击。删除

z-index:-1

，它就会起作用。请将它放在“已解决”上，这样其他人就不必在结果已经出现时开始查找。你的最终代码片段对我来说很好-@Krishnik：虽然这可以从理论上回答问题，但在这里包括答案的基本部分，并提供链接供参考。如果这个链接因为某种原因中断，你的答案将变得毫无用处。谢谢

$('#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;
});

$("#facheader").click(function(){
    $("#factable").slideToggle(); /* between () you can define speed in MS */
});

<tr><div class="factableheader">