Jquery 如何将类添加到打开的面板？

有人能帮我吗？我在一个页面上使用了两个面板，我一次只想显示一个，所以我对js进行了调整，但它似乎没有添加类。有人能帮忙吗

$(document).ready(function () { $("div.panel_buttonGal").click(function () { $("div#panelGal").animate({ height: "150px" }).animate({ height: "140px" }, "slow"); $("div.panel_buttonGal").toggle(); $("div#panelGal").addClass("open"); }); $("div#hide_buttonGal").click(function () { $("div#panelGal").animate({ height: "0px" }, "slow"); $("div#panelGal").removeClass("open"); }); $("div.panel_buttonAbt").click(function () { $("div#panelGal.open").animate({ height: "0px" }, "fast"); }); }); $（文档）.ready（函数（）{ $（“div.panel_buttonGal”）。单击（函数（）{ $（“div#panelGal”）。设置动画({ 高度：“150像素” }).制作动画({ 高度：“140像素” }“慢”）； $（“div.panel_buttonGal”）.toggle（）； $（“div#panelGal”）.addClass（“open”）； }); $（“div#hide_buttonGal”）。单击（函数（）{ $（“div#panelGal”）。设置动画({ 高度：“0px” }“慢”）； $（“div#panelGal”）.removeClass（“open”）； }); $（“div.panel_buttonAbt”）。单击（函数（）{ $（“div#panelGal.open”）。设置动画({ 高度：“0px” }“快”）； }); }); HTML看起来像这样

<pre><code>
<div id="panelGal" class="">
  <div class="panel_contents"> </div>
   <ul class="subnav">
            <li><a href="#">Engagements & Weddings</a></li>
            <li><a href="#">Maternity & Newborns</a></li>
            <li><a href="#">Seniors</a></li>
            <li><a href="#">Portraits</a></li>
            <li><a href="#">Photo Parties & Fundraisers</a></li>
            <li><a href="#">Special Events</a></li>
          </ul>
    </div>

    <div id="panelAbt" class="">
    <div class="panel_contents"> </div>
      <ul class="subnav">
            <li><a href="#">Bio</a></li>
            <li id="invest"><a href="#">Investment</a></li>
            <li><a href="#">Details (FAQ)</a></li>
            <li><a href="#">Testimonials</a></li>
            <li><a href="#">Vendors We Love</a></li>
          </ul>
    </div>

    <div id="nav">

        <div class="MainNav"><a href="#" class="rp">Home</a></div>
        <div class="MainNav"><a href="#" class="rp">About You</a></div>
        <div class="MainNav panel_buttonGal" style="display: visible;"><a class="rp">Galleries</a></div>
        <div class="MainNav panel_buttonGal" id="hide_buttonGal" style="display: none;"><a class="rp">Galleries</a></div>
        <div class="MainNav panel_buttonAbt" style="display: visible;"><a class="rp">About Us</a></div>
        <div class="MainNav panel_buttonAbt" id="hide_buttonAbt" style="display: none;"><a class="rp">About Us</a></div>
        <div class="MainNav"><a href="#" class="rp">The Latest</a></div>
        <div class="MainNav"><a href="#" class="rp">Proof & Shop</a></div>
        <div class="MainNav"><a href="#" class="rp">Contact Us</a></div>

    </div>

 </code></pre>

使用and代替。

使用（）代替添加CSS类和使用animate（），使用（）和：

---

html是什么样子的？假设您的开放样式是用于显示的包装器：无，替换$（“div#panelGal”）.addClass（“开放”）；带$（“div#panelGal”）.show（）；以及带有.hide（）的removeClass。如果在该样式（字体、颜色）中设置了其他属性，请使用jQuery在可选函数（）参数中设置它们

$(document).ready(function () {
        $("div.panel_buttonGal").hide();  // initial state
        $("div.panel_buttonGal").click(function () {
            $("div#panelGal").slideDown("slow");
            $("div.panel_buttonGal").toggle();
        });

        $("div#hide_buttonGal").click(function () {
            $("div#panelGal").slideUp("slow");
        });
        $("div.panel_buttonAbt").click(function () {
            $("div#panelGal").slideUp("fast");
        });
    });