Question

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

听起来很简单吧？那么我的问题是我希望能够切换单个菜单而且我无法搞清楚。

var mostRecentScanFromEachDomain =
    from u in this.db.ADScans
    where u.Enabled
    group u by u.Domain into g
    select g.OrderByDescending(u => u.ScanDate)
        .FirstOrDefault();

$("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;
}

Answer 1

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

＆＃13;

$("input:checkbox").on("change", function() {
  $(this).toggleClass("active");
  $("input:checkbox").not(this).removeClass("active").prop('checked', false);
})

＆＃13;

.d1, .d2, .d3 {
  display: none;
}

#d1:checked ~ .d1 {
  display: block;
}
#d2:checked ~ .d2 {
  display: block;
}
#d3:checked ~ .d3 {
  display: block;
}

.active {
  color: #6d4dfe;
}

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="checkbox" name="menubar" id="d1">
<label for="d1">Open 1</label>
<input type="checkbox" name="menubar" id="d2">
<label for="d2">Open 2</label>
<input type="checkbox" name="menubar" id="d3">
<label for="d3">Open 3</label>

<div class="d1"><div class="hi">Lorem ipsum dolor.</div></div>
<div class="d2">Lorem ipsum dolor sit amet.</div>
<div class="d3">Lorem ipsum dolor sit amet, consectetur adipisicing.</div>

＆＃13;

Answer 2

应该是这样的：

<html>
<head>
    <style>
        ul{
            float: left;
            overflow: hidden;
            height: auto;
            display: none;
            background-color: red;
        }
        #CheckMe:checked ~ #CM{
            display: block;
        }

        #CheckMeToo:checked ~ #CMT{
            display: block;
        }
    </style>
</head>
<body>
  <div style="position:relative;">
   <input type="radio" name="Menu" id="CheckMe" checked="checked">
   <input type="radio" name="Menu" id="CheckMeToo">
   <label for="CheckMe">press me</label>
    <ul id="CM">
        <li>1</li>
        <li>2</li>
        <li>3</li>
        <li>4</li>
        <li>5</li>
        <li>6</li>
    </ul>
    <ul id="CMT">
        <li>7</li>
        <li>8</li>
        <li>9</li>
        <li>10</li>
        <li>11</li>
        <li>12</li>
    </ul>
    </div>
</body>
</html>

如果您想根据选中的方框显示某些内容，则没有理由使用javascript，jquery或复选框。具有相同名称的Radioboxes只允许检查其中一个，所以是的。

复选框菜单切换

2 个答案: