如何捕捉面板關閉事件

Question

 $(document).ready(function(){ $('#hide').on('click', function (e) { $('#current-pane).show() }); }); 

 <link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet"/> <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script> <div class="panel-group"> <div class="panel panel-default" id="current-pane"> This is First Panel <a href="#current-pane" class="btn btn-primary btn-lg" data-dismiss="alert" aria-label="close" id="hide">Finish Call</a> </div> <div class="panel panel-info hide" id="current-pane"> Show me on close of first one </div> </div> 

我的要求是，一旦所有動作完成，就關閉div並顯示選擇另一個動作的其他div。

因此，我認為引導面板組件會有所幫助。 請不要，我不是在尋找崩潰的效果。 我想以某種動畫方式進行操作，以便給人以工作div已關閉的印象。

我正在努力尋找小組關閉活動。

Answer 1

div id必須是唯一的，例如current-pane1 ， current-pane2等。

 $(document).ready(function(){ $('#hide').on('click', function (e) { $('#current-pane1').slideToggle(); $('#current-pane2').removeClass("hide"); }); }); 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet"/> <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script> <div class="panel-group"> <div class="panel panel-default" id="current-pane1"> This is First Panel <a class="btn btn-primary btn-lg" data-dismiss="alert" aria-label="close" id="hide">Finish Call</a> </div> <div class="panel panel-info hide" id="current-pane2"> Show me on close of first one </div> </div>