jquery在最近输入更改时更新数据量

时间:2016-05-31 17:52:30

标签: jquery

我是jquery的新手,我很乐意得到一些帮助。我需要操纵一下eshop页面。点击+/-或手动更改输入值时,我需要更新最近data-quantity个链接的a

我有以下部分代码(在某些产品说明中):

<div class="small-product">

<div class="text-center">

   <div class="add-to-cart-button">
      <a href="/zeleny/kategorie-produktu/vareni/?removed_item=1&amp;add-to-cart=3854" data-quantity="1" rel="nofollow" data-product_id="3854" class="ajax_add_to_cart add_to_cart_button product_type_simple button alt-button small clearfix">Do košíku</a>
   </div>

   <div class="quantity">   
    <input type="number" step="1" min="1" max="8" name="quantity" value="1" title="Množství" class="input-text qty text" size="4">
   </div>

</div>
<div class="small-product">

<div class="text-center">

   <div class="add-to-cart-button">
      <a href="/zeleny/kategorie-produktu/vareni/?removed_item=1&amp;add-to-cart=3854" data-quantity="1" rel="nofollow" data-product_id="3854" class="ajax_add_to_cart add_to_cart_button product_type_simple button alt-button small clearfix">Do košíku</a>
   </div>

   <div class="quantity">   
    <input type="number" step="1" min="1" max="13" name="quantity" value="1" title="Množství" class="input-text qty text" size="4">
   </div>


</div>

这个jquery添加+ - 按钮并在点击时控制其最小值和最大值:

(function($) {
    function createQTYButtons(target) {
        // Quantity buttons
        $(target).find('div.quantity:not(.buttons_added), td.quantity:not(.buttons_added)').addClass('buttons_added').append('<input type="button" value="+" class="plus" />').prepend('<input type="button" value="-" class="minus" />');
        // Target quantity inputs on product pages
        $(target).find('input.qty:not(.product-quantity input.qty)').each(function() {
            var min = parseFloat($(this).attr('min'));
            if (min && min > 0 && parseFloat($(this).val()) < min) {
                $(this).val(min);
            }
        });
        $(target).on('click', '.plus, .minus', function() {
            // Get values
            var $qty = $(this).closest('.quantity').find('.qty'),
                currentVal = parseFloat($qty.val()),
                max = parseFloat($qty.attr('max')),
                min = parseFloat($qty.attr('min')),
                step = $qty.attr('step');
            var $qty_cart = $(this).closest('.text-center').find('.addt_to_cart_button'),
                qty_cart_val = parseFloat($qty_cart.data( "quantity" ) );
                console.log(qty_cart_val);          
            // Format values
            if (!currentVal || currentVal === '' || currentVal === 'NaN') currentVal = 0;
            if (max === '' || max === 'NaN') max = '';
            if (min === '' || min === 'NaN') min = 0;
            if (step === 'any' || step === '' || step === undefined || parseFloat(step) === 'NaN') step = 1;
            // Change the value
            if ($(this).is('.plus')) {
                if (max && (max == currentVal || currentVal > max)) {
                    $qty.val(max);
                } else {
                    $qty.val(currentVal + parseFloat(step));
                }
            } else {
                if (min && (min == currentVal || currentVal < min)) {
                    $qty.val(min);
                } else if (currentVal > 0) {
                    $qty.val(currentVal - parseFloat(step));
                }
            }
            // Trigger change event
            $qty.trigger('change');
        });
    }
    // jQuery plugin.
    $.fn.addQty = function() {
        return this.each(function(i, el) {
            createQTYButtons(el);
        });
    }
})(jQuery);       
jQuery('.small-product').addQty();

这是小提琴: https://jsfiddle.net/kybernaut/8aam5861/

提前多多感谢

1 个答案:

答案 0 :(得分:0)

如果它对任何人都有用,这是答案,我自己找到了解决方案:

$('.qty').bind('change', function() {
    $(this).closest('.text-center').find('a.ajax_add_to_cart').attr('data-quantity', $(this).val());
});