在表格行中启用禁用控件 [英] Enable Disable Controls in a table row

问题描述

我想在选中相应的chkView时启用该行的edit& delete复选框，如果未选中则禁用它们.最初，此代码根本不会触发.我要去哪里错了.

I would like to enable the edit&delete checkboxes of that row, when the respective chkView is checked and disable them if it is unchecked. This code is not firing at all in the first place. Where am i going wrong.

http://jsfiddle.net/75rVH/1/

HTML

<table id="table_forms">
    <tr>
        <td><input type="checkbox" class="chkView"/>View</td>
        <td><input type="checkbox" class="chkEdit" disabled/>Edit</td>
        <td><input type="checkbox" class="chkDelete" disabled/>Delete</td>
    </tr>
   <tr>
        <td><input type="checkbox" class="chkView"/>View</td>
        <td><input type="checkbox" class="chkEdit" disabled/>Edit</td>
        <td><input type="checkbox" class="chkDelete" disabled/>Delete</td>
    </tr>
</table>

JS:

$(document).on('change','.chkView',function(){
var row = $(this).closest('tr');
    if($(this).prop("checked",true))
    {
        $(row).find('.chkEdit').prop("disabled",false);
        $(row).find('.chkDelete').prop("disabled",false);
    }
    else
        {
        $(row).find('.chkEdit').prop("disabled",true);
        $(row).find('.chkDelete').prop("disabled",true);
    }

});

推荐答案

$(document).on('change','.chkView',function(){
var row = $(this).closest('tr');
    if($(this).is(':checked'))
    {           
      $(row).find('.chkEdit,.chkDelete').prop("disabled",false);    
    }
    else
    {
      $(row).find('.chkEdit,.chkDelete').prop("disabled",true);     
    }
});

选择器类中缺少'.'.

演示:

http://jsfiddle.net/J6TN8/2/

这篇关于在表格行中启用禁用控件的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！