如何确定引导程序崩溃是打开还是关闭?

use*_*050 23 javascript jquery collapse twitter-bootstrap

如果我有自举崩溃,我怎么能从点击事件中确定崩溃是打开还是关闭?

这是我的点击事件或者可能有更好的方法来使用点击事件?

$(document).on("click", "a.register-student-link", function() {
    // do some stuff to check if opening or closing
}
Run Code Online (Sandbox Code Playgroud)

<div>
  <a id=@space.EventId class="register-student-link" data-toggle="collapse" href=@spaceIdWith aria-expanded="false" aria-controls="collapseExample">
                                                    Register Student
                                                </a>
</div>
Run Code Online (Sandbox Code Playgroud)

use*_*050 28

如果区域是否折叠,Bootstrap使用aria-expanded属性显示true或false.

var isExpanded = $(collapsableRegion).attr("aria-expanded");
Run Code Online (Sandbox Code Playgroud)

  • 对于任何努力使其工作的人;确保在 HTML 中将 `aria-expanded` 属性初始化为 `true` 或 `false`! (3认同)

Jos*_*utz 22

尝试:

$('#collapseDiv').on('shown.bs.collapse', function () {
   console.log("Opened")
});

$('#collapseDiv').on('hidden.bs.collapse', function () {
   console.log("Closed")
});
Run Code Online (Sandbox Code Playgroud)
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css" rel="stylesheet"/>
<div>
  <a id=@space.EventId class="register-student-link" data-toggle="collapse" href="#collapseDiv" aria-expanded="false" aria-controls="collapseExample">Register Student</a>
</div>

<div class="collapse" id="collapseDiv">This is the collapsible content!</div>
Run Code Online (Sandbox Code Playgroud)

(基于/sf/answers/1270347221/(Kevin提到)和http://www.bootply.com/73101)


ada*_*039 17

我需要一种方法来确定在实际折叠之前元素是否已折叠.而事件监听器仅在事后触发.

//Will return true if uncollapsed
$('#collapseDiv').hasClass('in');

//Will return true if in the process of collapsing
$('#collapseDiv').hasClass('collapsing');

//Will return true if collapsed
$('#collapseDiv').hasClass('collapse');
Run Code Online (Sandbox Code Playgroud)


Kev*_*eim 4

您可以观看活动hidden.bs.collapse

参见小提琴: http: //jsfiddle.net/kyeuvx1d/