javascript - 如何在 div 标签上一个接一个地关闭和打开

Question

基本上，我试图轻松刷新可折叠的 div。其中，当我想更改数据时，我可以运行一个脚本，该脚本基本上关闭并打开 div(如果 div 打开)，如果 div 关闭则简单地打开它。 我的目标是使用与此类似的东西。

$("#procDiv").html("New Data");
if($("#procDiv").attr('class').contains("collapse in")) {
    $("#procDiv").collapse("close");
    $("#procDiv").collapse("open");
} else {
    $("#procDiv").collapse("open");
}

但我遇到了一个问题，因为当我告诉它打开时它没有打开，我认为这是因为它在动画中，所以它不期望任何新指令.

HTML

<form class="form-inline">
  <div class="form-group">
    <label class="sr-only" for="inputAirport">Airport</label>
    <input type="text" class="form-control" id="inputAirport" placeholder="Airport">
  </div>
  <button class="btn btn-primary btn-sm btn-search">Search</button>
</form>

<div class="panel panel-default">
    <div class="panel-heading">
        <h4 class="panel-title">
            <a data-toggle="collapse" href="#procDiv">Procedures</a>
        </h4>
    </div>
    <div id="procDiv" class="panel-collapse collapse"></div>
</div>

Answer 1

if($("#procDiv").hasClass("collapse in")) {
    $("#procDiv").slideDown();
} else {
    $("#procDiv").slideUp();
}

这样试试。

顺便说一下，您的代码中第 2 行存在语法错误。你错过了双引号