Bootstrap collapse prevent open

Prevent a collapsible element from opening.

by GertG

HTML

<script src="https://code.jquery.com/jquery-1.12.4.min.js"></script>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css">
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>
    <div class="panel-group">
     <div class="panel panel-default">
      <div class="panel-heading">
       <h4 class="panel-title">
       <a data-toggle="collapse" href="#collapse1">Collapsiblepanel</a>
       </h4>
      </div>
      <div id="collapse1" class="panel-collapse collapse">
     <div class="panel-body">Panel Body</div>
    <div class="panel-footer">Panel Footer</div>
  </div>
</div>

JavaScript

$('.panel-collapse').on('hide.bs.collapse', function (e) {
  console.log('collapse');
  console.log($(this).attr('class'));
  if(!confirm("Allow opening?")){
  	 return e.preventDefault();
  }
});