复选框菜单切换

如果选中checkbox1则不应该是其他任何一个。 如果选中checkbox2则不应该是其他任何一个。

听起来很简单吧? 那么我的问题是我希望能够切换单个菜单,我很难搞清楚。

$("label").on("click", function() { $(this).toggleClass("active") }) 
 .d1, .d2, .d3 { display: none; } #d1:checked ~ .d1 { display: block; } #d2:checked ~ .d2 { display: block; } #d3:checked ~ .d3 { display: block; } .active { color: #6d4dfe; } 
        
Lorem ipsum dolor.
Lorem ipsum dolor sit amet.
Lorem ipsum dolor sit amet, consectetur adipisicing.

假设你有理由选择复选框收音机,我相信这会做你想要的:

 $("input:checkbox").on("change", function() { $(this).toggleClass("active"); $("input:checkbox").not(this).removeClass("active").prop('checked', false); }) 
 .d1, .d2, .d3 { display: none; } #d1:checked ~ .d1 { display: block; } #d2:checked ~ .d2 { display: block; } #d3:checked ~ .d3 { display: block; } .active { color: #6d4dfe; } 
        
Lorem ipsum dolor.
Lorem ipsum dolor sit amet.
Lorem ipsum dolor sit amet, consectetur adipisicing.

应该是这样的:

      
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8
  • 9
  • 10
  • 11
  • 12

如果你想根据检查的方框显示某些东西,没有理由使用javascript,jquery或复选框。 具有相同名称的Radiobox只允许检查其中一个,所以是的。