如何在angular.js中创建一个多选按钮

Question

我想为食物浇头创建一个多选框。

我想点击美式奶酪，并且两者都处于活动状态，但每次我点击另一个时：悬停状态被移除。

我使用角度是有所不同的。

Answer 1

拥有CSS .active课程。然后在click元素上检查它是否有该类，如果已经删除它，则删除它，否则添加它。为此，您可以使用.toggleClass()：

＆＃13;

＆＃13;

$('.btn').click(function(){
  $(this).toggleClass( 'active' );
});

＆＃13;

.btn { border: 1px solid grey; }
.btn.active { background-color: DimGrey; }

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<button class='btn'>Extra Chesse</button>
<button class='btn'>American Chesse</button>
<button class='btn'>Swiss Chesse</button>

＆＃13;

＆＃13;

＆＃13;