Question

我有3个按钮，每个按钮都有一个复选框：

<div id="btn_group">
    <button class="btn"><i class="icon-check-empty"></i> One</button>
    <button class="btn"><i class="icon-check-empty"></i> Two</button>
    <button class="btn"><i class="icon-check-empty"></i> Three</button>
</div>

我目前的jQuery看起来像这样：

$('.btn').on('click',function() {
    $('#btn_group > .btn > i').removeClass('icon-check').addClass('icon-check-empty');
    $(this).children('i').toggleClass('icon-check-empty icon-check');
});

以下是需要发生的事情：

1）单击按钮1：选中按钮1，不检查所有其他

2）再次点击按钮1：未选中按钮1，其他所有按钮仍未选中

3）单击按钮1 :(参见＃1）

4）单击按钮2：选中按钮2，未选中所有其他按钮（如单选按钮）

基本上我需要一组单选按钮，允许您取消选中当前选择，但绝不允许选择多个。全部通过JS＆amp; amp;模拟jQuery的。你能帮忙吗？

Answer 1

你可以用一个班级来完成。

$('.btn').on('click',function() {
    $(this).toggleClass('icon-check').siblings().removeClass('icon-check');
}

如何在jQuery中模拟单选按钮功能？

1 个答案: