复选框已检查属性但未显示已选中

时间:2014-10-05 05:57:55

标签: javascript jquery

我的代码发生了一些奇怪的事情。我有两个按钮,一个带有类.add和.remove有一个复选框,由于按下了哪个按钮可以打开和关闭,所以如果你用删除按钮删除,则检查已检查,否则复选框得到取消选中,问题我我有的是当你重复使用.remove按钮时它添加了checked属性,但是复选框没有显示它被检查但是在html中它的属性就在那里。有谁知道如何解决这个问题

$('.variations_grid').on( 'click','.add', function(e) {
    var elements = $(this).closest('tr').find('td');
    var isDisabled = $(this).closest('tr').find('button.remove').is(':disabled')

    if(isDisabled) {
        $(this).closest('tr').removeClass('remove')
        $(this).closest('tr').find('.add').attr('disabled', 'disabled');
        $(this).closest('tr').find('button.remove').removeAttr('disabled');
        $(this).closest('tr').find('.delete:checkbox').attr('checked', false);
    } else {
        $(this).closest('tr').before(template);     
    }
    $.each(elements, function(index, element) {
        if(index > 1) {
            //$(this).find('select').removeAttr('disabled');
            //$(this).find('input').removeAttr('disabled')
        }
    });
});

$('.variations_grid').on( 'click','button.remove', function(e) {
    var elements = $(this).closest('tr').find('td');

    $(this).closest('tr').addClass('remove')
        $(this).closest('tr').find('.add').removeAttr('disabled');
        $(this).closest('tr').find('.remove').attr('disabled', 'disabled');
        $(this).closest('tr').find('.delete:checkbox').attr('checked', 'checked');  

    $.each(elements, function(index, element) {
        if(index > 1) {
            //$(this).find('select').attr('disabled', 'disabled');
            //$(this).find('input').attr('disabled', 'disabled')
        }
    });
});

HTML

<button class="btn btn-default btn-block add" type="button" disabled="disabled">&nbsp;<span class="glyphicon glyphicon-plus-sign"></span>&nbsp;</button>
<button class="btn btn-default btn-block remove" type="button">&nbsp;<span class="glyphicon glyphicon-minus-sign"></span>&nbsp;</button>
<input name="delete" type="checkbox" class="delete" />

1 个答案:

答案 0 :(得分:2)

您应该使用prop来更改已检查的属性。

.prop('checked' , true); // or false
相关问题