Question

如何在单击时使面板标题背景颜色不同。我尝试过使用.panel-heading :: active但它无效。

Answer 1

你可以通过jQuery做到这一点。例如：假设你的面板有class =＆＃34; changecolor＆＃34;，那么你可以在你的jQuery中加入这样的东西：

https://jsfiddle.net/luciocamilo/9xbtkjv4/

<html>
<head>
<link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css">

<!-- jQuery library -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.2/jquery.min.js"></script>

<!-- Latest compiled JavaScript -->
<script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>
</head>
<div class="panel panel-primary">

  <div class="panel-heading changecolor">
    Test
  </div>
  <div class="panel-body">
  Lorem ipsum dolor sit amet
  </div>
</div>
</body>
<script>
$(document).ready(function(){
$('.changecolor').click(function() {
      $(this).css('background-color','#EE178C')
    });
});
 </script>

造型Twitter Bootstrap手风琴

1 个答案: