jquery - 每当使用 Jquery 单击 td 时，如何将复选框标记为已选中？

Question

我有一个包含 N 个 tr > td 的表，我有 class="hrchy-dt-checkboxes"的复选框，所以每当我单击该 TD 时，都应该选中该复选框。

这是我的示例 HTML

<tr style="height:20.1pt;"><input disabled="disabled" value="" class="dt-checkboxes" id="row_2" type="checkbox"> 
  <td class="td_0_3">1<input disabled="disabled" value="" class="hrchy-dt-checkboxes" id="td_2" type="checkbox"></td>
  <td class="td_0_1">A-1) Efectivo y otros activos líquidos equivalentes</td>
  <td class="td_0_1">18063955860.200008</td>
  <td>&nbsp;</td>
  <td>&nbsp;</td>
  <td>&nbsp;</td>
  <td>&nbsp;</td>
  <td>&nbsp;</td>
  <td>&nbsp;</td>
  <td>&nbsp;</td>
  <td>&nbsp;</td>
  <td>&nbsp;</td>
  <td>&nbsp;</td>
  <td>&nbsp;</td>
  <td>&nbsp;</td>
  <td>&nbsp;</td>
  <td>&nbsp;</td> 
 </tr>
 <tr style="height:20.1pt;"><input disabled="disabled" value="" class="dt-checkboxes" id="row_1" type="checkbox"> 
  <td class="td_0_3">&nbsp;<input disabled="disabled" value="" class="hrchy-dt-checkboxes" id="td_1" type="checkbox"></td>
  <td class="td_0_1">ACTIVO: Total del Sector</td>
  <td class="td_0_1">Importe</td>
  <td>&nbsp;</td>
  <td>&nbsp;</td>
  <td>&nbsp;</td>
  <td>&nbsp;</td>
  <td>&nbsp;</td>
  <td>&nbsp;</td>
  <td>&nbsp;</td>
  <td>&nbsp;</td>
  <td>&nbsp;</td>
  <td>&nbsp;</td>
  <td>&nbsp;</td>
  <td>&nbsp;</td>
  <td>&nbsp;</td>
  <td>&nbsp;</td> 
 </tr>

更新:

if(checkboxClass.indexOf('hrchy-dt-checkboxes')!=-1){
    $('.hrchy-dt-checkboxes:checked').each(function(i){
        var idAttr=$(this).attr('id');
        var selectedTDVal=$(this).parent().text();
        var indexVal=idAttr.substring(idAttr.indexOf('_'),idAttr.length);
        indexVal=indexVal.replace('_','');
        var hrchyIndexId=parseInt(indexVal);
        selectedVal[i]=selectedTDVal;
        hrchyMap[hrchyIndexId]=selectedTDVal;
    });
    selectedVal=[];
}

根据上面的代码，每当单击复选框时，该值就会被带到后端。需要对此代码进行增强。

谢谢

Answer 1

您可以使用下面的代码来选中该复选框。但是我不知道您是否也需要取消选中该复选框，因此不添加该复选框。如果您需要，请告诉我。

// Code goes here
$( document ).ready(function() {

$('.hrchy-dt-checkboxes').parent().parent().click(function(){
  var elem = this;
  var chk = $(this).find('.hrchy-dt-checkboxes')[0];
  $(chk).prop('checked','checked');
})  
});

这是plunker对于相同的

更新:

以下是切换选择的更新代码:

$( document ).ready(function() {

$('.hrchy-dt-checkboxes').parent().parent().click(function(){
  var elem = this;
  var chk = $(this).find('.hrchy-dt-checkboxes')[0];
  var isChecked = $(chk).prop('checked');
    $(chk).prop('checked',!isChecked);  

})  
});