Question

我想要简单的切换类型按钮。我明白但是有些问题。选中单击标签复选框但无法检查剩余复选框。我使用了类，因为我通过asp转发器提供了未知数量的复选框。

我的HTML是enter code here

＆＃13;

$(".labcbox").click(function () {
  var selectedIndex = $('.labcbox').index($(this));
  if ($(".toggin").is(':checked')) {
    $(".toggin")[selectedIndex].checked = false;
  }
  else {
    $(".toggin")[selectedIndex].checked = true;
  }
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table>
  <tr>  
    <td>CheckBox toggle</td>
    <td>
      <input type="checkbox" class="toggin" />
      <label class="labcbox"></label>
      <div class="divmark">
        Hypertention
      </div>
    </td>
  </tr>
  <tr>
    <td>CheckBox toggle</td>
    <td>
      <input type="checkbox" class="toggin" />
      <label class="labcbox"></label>
      <div class="divmark">
        Hypertention
      </div>
    </td>
  </tr>
</table>

＆＃13;

Answer 1

没有必要使用jQuery，您只需将复选框包装在label标记中即可。

＆＃13;

<label>Click to check
  <input type="checkbox">
</label>

＆＃13;

Answer 2

您可以使用解决方案https://jsfiddle.net/pLq5ep80/

$(".labcbox").click(function () {
  $(this).siblings('input.toggin').prop('checked', !$(this).siblings('input.toggin').is(':checked'));
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table>
  <tr>
    <td>CheckBox toggle</td>
    <td>
      <input type="checkbox" class="toggin" />
      <label class="labcbox">Checkbox 1</label>
      <div class="divmark">
        Hypertention
      </div>
    </td>
  </tr>
  <tr>
    <td>CheckBox toggle</td>
    <td>
      <input type="checkbox" class="toggin" />
      <label class="labcbox">Checkbox 2</label>
      <div class="divmark">
        Hypertention
      </div>
    </td>
  </tr>
</table>

希望这会对你有所帮助。

通过jQuery单击标签时选中并取消选中复选框

2 个答案: