表の行またはセルをクリックしてチェックボックスを選択します.

チェックボックスが小さすぎて、注文できません.
最近、表の中にチェックボックスがあることが分かりましたが、チェックボックスが小さすぎて、簡単には注文できません.
直接コード

// html   
<link rel="stylesheet" type="text/css" href="lib/Bootstrap/css/bootstrap.min.css"/>
<script src="js/jquery-1.12.4.js" type="text/javascript" charset="utf-8"></script>
...
<table class="table">
  <tr>
    <th>  </th>
    <th>  </th>
    <th>  </th>
    <th></th>
  </tr>
  <tr>
    <td>  </td>
    <td> </td>
    <td>32</td>
    <td class="tdcheck"><input type="checkbox" id="checkbox-0" name="checkbox" /></td>
  </tr>
  <tr>
    <td>  </td>
    <td> </td>
    <td>29</td>
    <td class="tdcheck"><input type="checkbox" id="checkbox-1" name="checkbox" />
  </tr>
</table>

行チェックボックスをクリックして

を選択します.

$("tr").slice(1).on('click', function (event) { // slice(1)     
  //   checkbox  
  var chks = $("input[type='checkbox']",this);
  if ( chks.prop("checked") ) {
    chks.prop("checked",false);
  } else {
    chks.prop("checked",true);
  }
});

チェックボックスがあるセルのチェックボックスをクリックして

をチェックします.

$(".tdcheck").on('click', function(event) {
  var checkbox = $(this).find(":checkbox");
  if ( checkbox.prop("checked") ) {
    // checkbox.removeAttr("checked");
    checkbox.prop("checked", false);
  } else {
    checkbox.prop("checked", true);
  }
});

しかし、このように一つの問題が見つかりました.チェックボックスをつけるとかえって反応がなくなりました.ブレークポイントで発見しました.元々はイベントが泡を噴き出しています.解決方法はチェックボックスをクリックする時に泡が出ないようにしてください.

var $input = $("input[type='checkbox']");
for (let i = 0; i < $input.length; i++) {
  $($input[i]).click(function(event) {
    event.stopPropagation();
  });
}

はい、問題が解決しました.間違ったところがあれば、よろしくお願いします.