如何根据特定条件禁用和启用javascript按钮？

当加载此页面且这些按钮之间的值等于1时，我想禁用（-）按钮

1） 哈佛商学院代码 注: 当购物车页面只有一组产品时，上述代码可以正常工作。但是，在多个产品列表的情况下（如上图所示），它并不像我预期的那样工作。换句话说，我想分别控制每个产品的按钮，而不覆盖其他按钮

---

如何做到这一点？

使用唯一ID识别每个产品将有助于解决此问题。

整个文档中的ID必须是唯一的。您当前正在重复每行上的所有ID

getElementById（）

无法工作，因为它只需要一个元素。如何提供单独的id？给每个元素一个唯一的id甚至不是解决方案。如果有50个元素，则必须手动附加事件侦听器50次。哇，太重了，杀伤力太大了。你想要的是一门课。给出相同的类

。然后，您可以同时将一键式处理程序附加到所有按钮上，然后

onclick

读取

data target

属性，这样您就知道要删除哪个产品。删除按钮工作正常。但问题出现在递增和递减按钮上。如果我按下第一行的一个按钮，第二行的按钮也会受到影响。

<tbody>

    {{#each products}}

     <tr>

     <h1 id="Quantity" hidden>{{this.quantity}}</h1>

     <td><img src="/product-images/{{this.product._id}}.jpg" style="width:70px;height:70px" alt=""> 
  </td>

     <td>{{this.product.Name}}</td>

     <td>Rs.{{this.product.Price}}</td>

     <td>

     <button class="btn btn-info mr-3 cart-item-count" id="button(-)" 
   onclick="changeQuantity('{{this._id}}','{{this.product._id}}','{{../user._id}}',-1)">-</button>
 
     <span id="{{this.product._id}}">{{this.quantity}}</span>

     <button class="btn btn-info mr-3 cart-item-count" id="button(-)" 
    onclick="changeQuantity('{{this._id}}','{{this.product._id}}','{{../user._id}}',1)">+</button>

     <td>

     <button type="button" class="btn btn-danger">Remove</button>

     </td>

     </tr>

     {{/each}}

     </tbody>

 let Quantity = document.getElementById('Quantity').innerHTML
    console.log(Quantity)
    if (Quantity == 1) {
        document.getElementById('button(-)').disabled = true
    } else {
        document.getElementById('button(-)').disabled = false
    }
    
    function changeQuantity(cartId, proId, userId, count) {
        count = parseInt(count)
        let quantity = parseInt(document.getElementById(proId).innerHTML)
        let qty = quantity + count
        console.log(qty)
        if (qty > 1 ) {
            document.getElementById('button(-)').disabled = false
        } else if (qty == 1 || qty==10) {
            document.getElementById('button(-)').disabled = true
        }

        if(qty==10){
            document.getElementById('button(+)').disabled = true
        }else{
            document.getElementById('button(+)').disabled = false
        }

        $.ajax({
            url: '/change-product-quantity',
            data: {
                cart: cartId,
                product: proId,
                user: userId,
                count: count,
                quantity: qty
            },
            method: 'post',
            success: (response) => {

                document.getElementById(proId).innerHTML = quantity + count
                document.getElementById('total').innerHTML = response.total

            }
        })
    }