jQuery,获得下一个div

时间:2015-12-18 08:33:48

标签: javascript php jquery

我有jQuery代码,由PHP制作的<input type="number">数字微调器,因此它们都具有相同的div。 我想更改jQuery代码,以便在每个<input>当前$ price(以PHP为单位)*输入的当前值之后写入附近。
价格是PHP中的一个变量,每个<input>都有所不同。 问题是我不知道如何让jQuery更改最近的div,所以现在它总是得到PHP中的第一个$ price并更改第一个<input>的div。

PHP代码:

<?php foreach ( $addon['options'] as $key => $option ) :
$price         = $option['price'] > 0 ? '' . wc_price( get_product_addon_price_for_display( $option['price'] ) ) . '' : '';
?>

    <input type="number" min="0" max="9" />

    <?php if ( 1 ) : ?>

    <label id="oldprice" style="display:none;"><?php echo wptexturize( $option['label'] ) . ' ' . $price;?></label>

    <label><div id="newprice"></div></label>

    <?php endif; ?> 

和jQuery:

jQuery(
    function( $ ) {

var $testProp = $('div.quantity:not(.buttons_added), td.quantity:not(.buttons_added)').find('.AddnQty');
if ($testProp && $testProp.prop('type') != 'date') {
  // Quantity buttons
  $('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
  $('input.AddnQty:not(.product-quantity input.AddnQty)').each(
    function() {

      var min = parseFloat($(this).attr('min'));

      if (min && min > 0 && parseFloat($(this).val()) < min) {
        $(this).val(min);
      }
    }
  );


  $(document).on(
    'click', '.plus, .minus',
    function() {

      // Get values
      var $AddnQty = $(this).closest('.quantity').find('.AddnQty'),
        currentVal = parseFloat($AddnQty.val()),
        max = parseFloat($AddnQty.attr('max')),
        min = parseFloat($AddnQty.attr('min')),



        regex = /[+-]?\d+(\.\d+)?/g,

        price = document.getElementById("oldprice").innerHTML,
        oldprice = price.match(regex).map(function(v) { return parseFloat(v); }),        


        step = $AddnQty.attr('step');


      // 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)) {
          $AddnQty.val(max);
        } else {
          $AddnQty.val(currentVal + parseFloat(step));
        }
      } else {

        if (min && (min == currentVal || currentVal < min)) {
          $AddnQty.val(min);
        } else if (currentVal > 0) {
          $AddnQty.val(currentVal - parseFloat(step));
        }
      }



       document.getElementById("newprice").innerHTML = oldprice * parseFloat($AddnQty.val());


      // Trigger change event

      $AddnQty.trigger('change');
    }
  );
}
});

所以这里我得到的价格是PHP输入的整数。但它始终需要第一个div。

 regex = /[+-]?\d+(\.\d+)?/g,

        price = document.getElementById("oldprice").innerHTML,
        oldprice = price.match(regex).map(function(v) { return parseFloat(v); }),        

在这里,我在乘以后改变它。但它只适用于第一次输入。

       document.getElementById("newprice").innerHTML = oldprice * parseFloat($AddnQty.val());

我知道应该只有1个身份证。我是这样做的,因为它更容易解释问题 我尝试使用getElementsByClassName来实现它,但有没有办法获得当前正在使用的<input>的当前数量,所以我们可以使用这个数字来更改正确的newprice类?

0 个答案:

没有答案