打开新开关时取消选中或关闭所有基于复选框的切换开关？

Question

我在我的一个项目中使用了一些 CSS3 切换开关，它们目前切换得很好，但我希望发生的是所有其他切换在新切换时关闭活性。任何人都可以帮助我开始这件事。我什至不知道从哪里开始。这些是我正在使用的切换：

http://wsnippets.com/styling-checkbox-toggle-switches-css3/

Javascript 有办法做到这一点吗？任何指导都会有所帮助。

Answer 1

在不太了解您的项目的情况下，一种解决方案是使用单选按钮而不是复选框来切换开关。这样，单选按钮的默认行为将在激活新单选按钮时取消选择 other/s。

Answer 2

如果您使用的是 jQuery，这样做就可以了：

$(function() {
  $('.checkbox-switch input').change(function() {
    if($(this).prop('checked')) {
      $(".checkbox-switch input").prop('checked', false);
      $(this).prop('checked', true);
    }
  });
});

在您的 link 中查看使用示例 html/css 的演示：http://codepen.io/anon/pen/MymGqP。