Question

我想要做的是我添加了两个默认禁用的按钮。当我添加一个项目时，按钮将启用一旦我点击收据按钮，选中的复选框应该消失，这在我的笔记本电脑中工作但不在小提琴中如果我单击收据，它应该removeAttr选中复选框，按钮应该禁用，因为没有选中复选框..我的代码JSFIDDLE

使用Javascript：

// json data object
var data = JSON.parse('{ "122233334444": ["Book","Three Musketters","DE7598490587","7584092043857", "03/18/13 11:17:51 AM","03/18/13 11:17:51 AM", "1" ], "122223355552":["eBook","Fall Colors","XYZ29494949","7584092043857", "03/18/13 11:17:51 AM","03/18/13 11:17:51 AM", "2" ], "122223355533":["eBook","Snowfall","XYZ29494949","7584092043857", "03/18/13 11:17:51 AM","03/18/13 11:17:51 AM", "3" ] }');
$("#submitid").click(function () {
    $('#resend').removeAttr('disabled');
    $('#receipt').removeAttr('disabled');
    var rowId = $("#number").val();
    $("#number").val("");
    var rowData = data[rowId];
    if (rowData) {

        var tr = $("<tr><td><input id='item-id' type='checkbox' checked/></td></tr>").attr("id", "datatable-row-" + rowId);
        for (var col = 0; col < rowData.length; col++)
        tr.append($("<td></td>").text(rowData[col]));
        $("#datatable").prepend(tr);
        $("#datatable").show();
    } else {
        alert("Row doesn't exist in json object: " + rowId);
    }
});
$('#receipt').click(function () {
    $('#item-id').removeAttr('checked');

    $('#resend').attr('disabled');
    $('#receipt').attr('disabled');



});

Answer 1

首先，不要对您的复选框使用相同的ID， ID属性在HTML页面中应该是唯一的。如果要取消选中所有复选框，则可以使用此选项：

$('#receipt').click(function(){
    $(':checked').removeAttr('checked');
    $('#resend, #receipt').attr('disabled','disabled');
});

<强> Demo fiddle

Answer 2

您不能拥有多个具有相同ID的元素，ID必须是唯一的。您应该使用id="item-id"。

，而不是class="item-id"

要删除复选标记，您应使用removeProp('checked')，而不是removeAttr('checked')。属性是指静态DOM属性，它们仅用作输入元素的初始设置，属性是用户可以对元素进行的动态更改。

Answer 3

您在不同的浏览器中遇到不同的行为，因为您使用重复的HTML元素ID（它们应该是唯一的！）和jQuery .attr()和.removeAttr()，您应该使用.prop()。这将确保您的代码在不同的浏览器中更可靠地工作。

删除重复的ID。新代码将不再引用它们。

要取消选中所有选中的复选框，您可以使用简单的选择器，例如

$('#datatable :checkbox')

或

$('#datatable :checkbox:checked')

对JS代码的更改（ working fiddle ）

$("#submitid").click(function () {
    $('#resend').prop('disabled', false);
    $('#receipt').prop('disabled', false);

和

$('#receipt').click(function(){
    $('#datatable :checkbox:checked').prop('checked', false);
    $('#resend').prop('disabled', true);
    $('#receipt').prop('disabled', true);

Answer 4

试试这个

$('#receipt').on("click",function(){
    $(':checked').removeAttr('checked');

    $('#resend').attr('disabled','disabled');
    $('#receipt').attr('disabled','disabled');



});

FIDDLE Demo

禁用该按钮并使用jquery取消选中该复选框

4 个答案: