Question

我这里有一个脚本获取所有行输入的总和。如果to qty_total字段为空或等于零，我需要做的是禁用每行的添加按钮。这就是我现在所拥有的http://jsfiddle.net/xt4HK/2/

任何帮助都会表示赞赏。

$('.qtys').blur(function () {
    var sum = 0;
    $(this).closest('tr').find('.qtys').each(function () {
        sum += Number($(this).val());
    });
    $(this).closest('tr').find('.qty_total').val(sum);
});
$('.qty_total').each(function() {
    if ($(this).val() != "") {
    $('.add_to_cart').prop("disabled",false);
    } else {
    $('.add_to_cart').prop("disabled",true);
    }
});

Answer 1

您可以使用attr()和removeAttr()，并且需要将每个循环放在事件中。

做这样的事情：

     $('.qty_total').each(function() {
    if ($(this).val() != "") {
    $(this).closest('tr').find('.add_to_cart').removeAttr("disabled");
    } else {
    $(this).closest('tr').find('.add_to_cart').attr("disabled","disabled");
    }
});

并将此置于模糊事件中。

或者您可以像这样使用prop()：

$('.qty_total').each(function() {
    if ($(this).val() != "") {
    $(this).closest('tr').find('.add_to_cart').prop("disabled",false);
    } else {
    $(this).closest('tr').find('.add_to_cart').prop("disabled",true);
    }
});

FIDDLE DEMO

DEMO with prop()

Answer 2

您可以在onblur事件处理程序中禁用该按钮，因为如果不这样做，在重新编辑后再次使总数变为空，则该按钮不会被禁用。

$('.qtys').blur(function () {
  var sum = 0;
  $(this).closest('tr').find('.qtys').each(function () {
     sum += Number($(this).val());
  });
  $(this).closest('tr').find('.qty_total').val(sum)
                       .closest('td').next()
                       .find('.add_to_cart')[0].disabled = sum == 0;

}).blur();

Demo.

Answer 3

$('.qty_total').each(function () {
        if ($(this).val() == "") {
            $('.add_to_cart').attr("disabled", "disabled");
        } else {
            $('.add_to_cart').removeAttr("disabled");
        }
    });

Answer 4

你的意思是：

//disable all add buttons on document load
$('.add_to_cart').prop("disabled",true);

$('.qtys').blur(function () {
    var sum = 0;
    $(this).closest('tr').find('.qtys').each(function () {
        sum += Number($(this).val());
    });
    var qtyEle = $(this).closest('tr').find('.qty_total');
    qtyEle.val(sum);    
    //check if sum exists and enable/disable accordingly
    $(this).parents("tr").find(".add_to_cart").prop("disabled", !sum);    
});

Updated jsFiddle

Answer 5

选中 Working Fiddle

checkTotal();
$('.qtys').blur(function () {
    var sum = 0;
    $(this).closest('tr').find('.qtys').each(function () {
        sum += Number($(this).val());
    });
    $(this).closest('tr').find('.qty_total').val(sum);
    checkTotal();
});

function checkTotal(){
$('.qty_total').each(function() {

    if ($(this).val() === ""  || $(this).val() === 0 ) {
        $(this).closest('tr').find('.add_to_cart').prop("disabled",true);
    } else {
        $(this).closest('tr').find('.add_to_cart').prop("disabled",false);
    }
});
}

优化版本 Fiddle

$('.add_to_cart').prop("disabled",true);
$('.qtys').blur(function () {
    var sum = 0;
    var parentTr = $(this).closest('tr');
    parentTr.find('.qtys').each(function () {
        sum += Number($(this).val());
    });
    parentTr.find('.qty_total').val(sum);

    parentTr.find('.add_to_cart').prop("disabled",(sum === ""  || sum === 0));

});

更改：

你的if()条件错了，反之亦然。
您必须检查每个模糊事件的空状态。你的代码只是在DOM就绪了。所以我把条件放在一个共同的函数checkTotal()。
添加了value = 0的条件。
要停用/启用该按钮，您需要使用<button>找到相应的$(this).closest('tr').find('.add_to_cart');而不是$('.add_to_cart') - 这将禁用/启用所有按钮。

Answer 6

只需输入$('.qty_total').each代码，但您也应该修改一些内容：

$('.qtys').blur(function () {
    var sum = 0;
    $(this).closest('tr').find('.qtys').each(function () {
        sum += Number($(this).val());
    });
    $(this).closest('tr').find('.qty_total').val(sum);

    // put this piece inside.
    $('.qty_total').each(function() {
        if ($(this).val() != "") {
            // prop --> attr and other change.
            $(this).closest('tr').find('.add_to_cart').attr("disabled",false);
        } else {
            // prop --> attr and other change.
            $(this).closest('tr').find('.add_to_cart').attr("disabled",true);
        }
    });
});

Answer 7

$('.qty_total').each(function() {
    if ($(this).val() != "") {
    $(this).parent('tr').find('.add_to_cart').prop("disabled",false);
    } else {
    $(this).parent('tr').find('.add_to_cart').prop("disabled",true);
    }
});

如果你使用$（＆＃39; .add_to_cart＆＃39;），JQuery返回所有元素都有class =＆＃34; add_to_cart＆＃34;。

Answer 8

尝试这个，模拟文本框上的更改事件。

$('.add_to_cart').prop("disabled",true);
$('.qtys').blur(function () {
    var sum = 0;
    $(this).closest('tr').find('.qtys').each(function () {
        sum += Number($(this).val());
    });
    $(this).closest('tr').find('.qty_total').val(sum).change();
});

$(document).on('change','.qty_total',function() {
    if ($(this).val() != "" || $(this).val() != 0) {
    $(this).parent().parent().find('.add_to_cart').prop("disabled",false);
    } else {
    $(this).parent().parent().find('.add_to_cart').prop("disabled",true);
    }
});

小提琴：http://jsfiddle.net/xt4HK/9/

每行禁用按钮

8 个答案:

Demo.