如何確定引導程序崩潰是打開還是關閉？

Question

如果我有 bootstrap 折疊，我如何從點擊事件中確定折疊是打開還是關閉？

這是我的點擊事件，或者也許有更好的方法來使用點擊事件？

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

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

Answer 1

Bootstrap 使用 aria-expanded 屬性來顯示區域是否折疊為真或假。

var isExpanded = $(collapsableRegion).attr("aria-expanded");

Answer 2

嘗試：

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

 <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>

（基於https://stackoverflow.com/a/18147817/2033574 （提到凱文）和http://www.bootply.com/73101 ）

Answer 3

我需要一種方法來確定元素在實際折疊之前是否已折疊。 而事件偵聽器僅在之后觸發。

//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');

Answer 4

您可以觀看活動hidden.bs.collapse

見小提琴： http : //jsfiddle.net/kyeuvx1d/

Answer 5

if(!$("#id").hasClass('show')){
    alert("Uncollapsed");
}
else {
    alert("Collapsed");
}

引導程序 4

Answer 6

function checkStatus() {

    if($('#item1').hasClass('in')) {
        alert('closing')    
    } else {
        alert('opening')    
    }   
}

checkStatus()