Question

<table class="table table-bordered table-striped table-hover table-mc-red" id="myTable">
                        <thead>
                            <tr>
                                <th>Product</th>
                                <th>Description</th>
                                <th>Availability</th>
                                <th>Price</th>
                                <th>Qty</th>
                                <th>Subtotal</th>
                                <th>Action</th>
                            </tr>
                        </thead>
                        <tbody>
                            <?php $subtotal = 0; foreach($cart_details as $cart) { ?>
                                <form action="<?php echo base_url('cart/updateCart'); ?>" method="post">
                                <tr>
                                    <input type="text" name="rowId[]" value="<?php echo $cart['rowid']; ?>" style="display: none;">
                                    <td data-title="Product" class="vertical_text">
                                        <img src="<?php echo $cart['options']['image_url']; ?>" class="img-responsive" style="height: 75px;">
                                    </td>
                                    <td data-title="Description" class="vertical_text">
                                        <h5><?php echo $cart['name'] ?></h5>
                                        <p>
                                            <?php echo $cart['options']['desc']; ?>
                                        </p>
                                        <input type="text" name="pincode[]" value="<?php echo $cart['options']['desc']; ?>" style="display: none;">
                                    </td>
                                    <td data-title="Availability" class="vertical_text">
                                        Stock Available
                                    </td>
                                    <td data-title="Price" class="vertical_text">
                                        <span class="p_price"><?php echo $cart['price']; ?></span>
                                    </td>
                                    <td data-title="Qty" class="vertical_text quantity">
                                       <button type="button" class="quantity-left-minus btn btn-danger btn-number"  data-type="minus" data-field="">
                                            <span class="glyphicon glyphicon-minus"></span>
                                        </button> 

                                        <input class="cart-input" type="text" name="qty[]" id="quantity" value="<?php echo $cart['qty']; ?>">
                                         <button type="button" class="quantity-right-plus btn btn-success btn-number" data-type="plus" data-field="">
                                        <span class="glyphicon glyphicon-plus"></span>
                                    </button>
                                    </td>
                                    <td data-title="Subtotal" class="vertical_text">
                                        <span class="sub_total_amt"><i class="fa fa-inr"></i> <?php echo number_format($cart['subtotal'], 2); ?></span>
                                    </td>
                                    <td data-title="Action" class="vertical_text">
                                        <button class="button remove" onclick="delete_cart_product('<?php echo $cart['rowid']; ?>');"><i class="fa fa-trash"></i> Remove</button>
                                    </td>
                                </tr>
                                <?php $subtotal = $subtotal+$cart['subtotal']; } ?>

                        </tbody>
                    </table>

这是我的foreach循环表。即时通讯使用codeigniter和bootstrap。

$(document).ready(function(){

                var quantitiy=0;
    $('.quantity-right-plus').click(function(e){

    // Stop acting like a button
    e.preventDefault();
    // Get the field name
    var quantity = parseInt($('#quantity').val());//10

    // If is not undefined

        $('#quantity').val(quantity + 1);


        // Increment

});

 $('.quantity-left-minus').click(function(e){
    // Stop acting like a button
    e.preventDefault();
    // Get the field name
    var quantity = parseInt($('#quantity').val());

    // If is not undefined

        // Increment
        if(quantity>1){
        $('#quantity').val(quantity - 1);
        }
});

});

这是我的jquery代码。

我的问题在于此代码。

    <td data-title="Qty" class="vertical_text quantity">
        <button type="button" class="quantity-left-minus btn btn-danger btn-number"  data-type="minus" data-field="">
              <span class="glyphicon glyphicon-minus"></span>
        </button> 
        <input class="cart-input" type="text" name="qty[]" id="quantity" value="<?php echo $cart['qty']; ?>">
       <button type="button" class="quantity-right-plus btn btn-success btn-number" data-type="plus" data-field="">
           <span class="glyphicon glyphicon-plus"></span>
       </button>
</td>

每当foreach循环生成第二行或第三行时，输入#quantity的id相同，当我点击第二行或第三行（+）按钮或（ - ）按钮时，第一行输入的值递增或递减。它发生了相同id #quantity的becoz。当我点击第二行（+）按钮或（ - ）按钮时，我只想要第二个输入增量或减量的值。有人帮忙。

Answer 1

您不能对同一页面上的多个元素使用相同的id。如果您确实需要通过id标识每个字段，则需要确保它们是唯一的，例如你可以附加一个计数器：quantity_1，quantity_2等等。

对于您的情况，更好的解决方案是完全从字段中删除id属性，并找到在增量/减量脚本中定位输入字段的替代方法。下面的解决方案将类cart-input的字段定位在与单击的按钮相同的表格单元格中。

<强> HTML / PHP

<input class="cart-input" type="text" name="qty[]" value="<?php echo $cart['qty']; ?>">

<强>的JavaScript

$('.quantity-right-plus').click(function (e) {
    e.preventDefault();

    var $field = $(this).closest('td').find('.cart-input');
    var quantity = parseInt($field.val(), 10);

    $field.val(quantity + 1);
});

另外，请确保始终在parseInt()上指定基数参数，以避免令人讨厌的错误。

增量递减jquery

1 个答案: