javascript - jquery every() 函数不适用于输入字段

Question

我有一个购物车选项，其中增加了产品选项。该选项有一个文本输入和加/减选项

标记

<td class="cart-item-qty">
    <div class="quantity-mius">-</div>
    <div class="quantity">
        <input type="text" class="cart-main-product-qty" value="1" />
    </div>
    <div class="quantity-plus">+</div>
</td>

像上面这样大约有5到6种输入类型

和 JavaScript 代码:

var minus = $(".quantity-mius");
var plus = $(".quantity-plus");
var itemValue = $(".cart-main-product-qty");

$(".cart-item-qty").each(function(index) {
    $(this).find(plus).on('click', function(e){
        e.preventDefault();
        increment();
    });
    $(this).find(minus).on('click', function(e){
        e.preventDefault();
        decrement();
    });
});

function increment(){
    newValue = itemValue.val(); 
    newValue++;
    itemValue.val(newValue);
};

function decrement(){
    newValue = itemValue.val();
    newValue--;
    if(newValue < 1){
        itemValue.val(0);
    }else{
        itemValue.val(newValue);
    }
};

当我按下加号按钮时，所有输入中的输入值都会增加，而当我按下加号按钮时，所有输入值都会减少。

Answer 1

Onclick 在这些icon 上只需调用该函数并找到其具有该类的兄弟 并计算值。尝试使用 -

$(".quantity-plus").on('click', function(e){
    e.preventDefault();
    increment($(this));
});
$(".quantity-mius").on('click', function(e){
    e.preventDefault();
    decrement($(this));
});

function increment($this){
    itemValue = $this.siblings('.cart-main-product-qty');
    newValue = itemValue.val(); 
    newValue++;
    itemValue.val(newValue);
};

function decrement(){
    itemValue = $this.siblings('.cart-main-product-qty');
    newValue = itemValue.val();
    newValue--;
    if(newValue < 1){
        itemValue.val(0);
    }else{
        itemValue.val(newValue);
    }
};