javascript - 当另一个字段的值为0时，如何禁用复选框？

首先，这是一个jsFiddle：https://jsfiddle.net/1wL1t21s/

我有多个复选框（可能有1个，或者可能有10个），用户可以在其中选择浇头和+或-的数量。现在，他们必须增加数量并选择一个复选框来启用它。

我的目标是使它成为hidden复选框，但当数量为checked时为1 or more，而当数量为unchecked时为0。请注意，可以使用+或-以及键盘来更改数量。

<input value="29|5|Pepperoni|" data-id="9" data-option="" rel="multiple"
class="sub_item_name sub_item_name_9"
type="checkbox" name="sub_item[9][0]" id="sub_item_9_0">

<input class="numeric_only left addon_qty" maxlength="5"
type="text" value="0" name="addon_qty[9][0]" id="addon_qty_9_0">

现在，我有这样的增量选项：

$( document ).on( "click", ".qty-addon-plus", function() {
       var parent=$(this).parent().parent();
       var child=parent.find(".addon_qty");
       var qty=parseFloat(child.val())+1;
       if (isNaN(qty)){
            qty=1;
       }
       child.val( qty );
   });

   $( document ).on( "click", ".qty-addon-minus", function() {
       var parent=$(this).parent().parent();
       var child=parent.find(".addon_qty");
       var qty=parseFloat(child.val())-1;
       if (qty<0){
            qty=0;
       }
       child.val( qty );
   });

但这不会选中或取消选中特定的复选框。我该怎么办？任何帮助是极大的赞赏 ：）

最佳答案

只需在两个click函数中添加两行代码即可。

首先，您需要找到该特定项目的复选框，然后根据数量来选择/不选择。

   var checkBox = $(this).parents('.top10').find('input[type=checkbox].sub_item_name');
   checkBox.prop('checked', true);

现在，当我们单击加号/减号按钮时，我们将找到的父级并获取输入类型复选框，以便一旦获得特定元素，则取决于数量，我们可以进行选中/取消选中

checkBox.prop('checked', true);   // when qty > 0
checkBox.prop('checked', false);  // when qty == 0

这样您就可以实现您的要求。

下面将完美地工作

 $( document ).on( "click", ".qty-addon-plus", function() {
   var parent=$(this).parent().parent();
   var child=parent.find(".addon_qty");
   var qty=parseFloat(child.val())+1;
   if (isNaN(qty)){
        qty=1;
   }
   child.val( qty );

   var checkBox = $(this).parents('.top10').find('input[type=checkbox].sub_item_name');
   checkBox.prop('checked', true);

 });

 $( document ).on( "click", ".qty-addon-minus", function() {
   var parent=$(this).parent().parent();
   var child=parent.find(".addon_qty");
   var qty=parseFloat(child.val())-1;
   if (qty<0){
        qty=0;
   }
   child.val( qty );

   var checkBox = $(this).parents('.top10').find('input[type=checkbox].sub_item_name');
   if (qty == 0) {
       checkBox.prop('checked', false);
   }

  });

希望这可以帮助。谢谢 ！