“Подхват” значения из input

126
02 января 2020, 17:00

Не могу реализовать так, чтобы кнопка Купить брала значение из инпута, именно то которое прописано в поле, но когда смотрю код элемента, у этого инпута значение value=0, не изменяется. И получается что кнопка Купить берет всяких раз значение которое было прописано первоначально т.е. 0. Как возможно это исправить? Вот код:

jQuery(document).ready(function() { 
  // This button will increment the value 
  $('.qtyplus').click(function(e) { 
    // Stop acting like a button 
    e.preventDefault(); 
    // Get the field name 
    fieldName = $(this).attr('field'); 
    // Get its current value 
    var currentVal = parseInt($('input[name=' + fieldName + ']').val()); 
    // If is not undefined 
    if (!isNaN(currentVal)) { 
      // Increment 
      $('input[name=' + fieldName + ']').val(currentVal + 1); 
    } else { 
      // Otherwise put a 0 there 
      $('input[name=' + fieldName + ']').val(0); 
    } 
  }); 
  // This button will decrement the value till 0 
  $(".qtyminus").click(function(e) { 
    // Stop acting like a button 
    e.preventDefault(); 
    // Get the field name 
    fieldName = $(this).attr('field'); 
    // Get its current value 
    var currentVal = parseInt($('input[name=' + fieldName + ']').val()); 
    // If it isn't undefined or its greater than 0 
    if (!isNaN(currentVal) && currentVal > 0) { 
      // Decrement one 
      $('input[name=' + fieldName + ']').val(currentVal - 1); 
    } else { 
      // Otherwise put a 0 there 
      $('input[name=' + fieldName + ']').val(0); 
    } 
  }); 
  $('.button__buy').click(function(event) { 
    event.preventDefault(); 
    var quantity = $('input[name="quantity"]').val(); 
  }); 
});
#myform { 
  text-align: center; 
  padding: 5px; 
  border: 1px dotted #ccc; 
  margin: 2%; 
} 
 
.qty { 
  width: 40px; 
  height: 25px; 
  text-align: center; 
} 
 
input.qtyplus { 
  width: 25px; 
  height: 25px; 
} 
 
input.qtyminus { 
  width: 25px; 
  height: 25px; 
} 
 
.button__buy { 
  line-height: 30px; 
  border-radius: 3px; 
  background: #027603; 
  color: #fff; 
  border: none; 
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> 
<form id='myform' method='POST' action='#'> 
  <input type='button' value='-' class='qtyminus' field='quantity' /> 
  <input type='text' name='quantity' value='0' class='qty' /> 
  <input type='button' value='+' class='qtyplus' field='quantity' /> 
  <input class="button__buy" type="button" value="Купить"> 
</form>

Answer 1

Проверил, обработчик клика по кнопке берет актуальное значение

$('.button__buy').click(function(event) {
  event.preventDefault();
  var quantity = $('input[name="quantity"]').val();
});
READ ALSO
Калькулятор умножения и сложения

Калькулятор умножения и сложения

Есть калькулятор, не пойму как перемножить кол-во на стоимость курса затем сложиь значения всех полей и вывести в итого, подскажите плизз

120
Сортировка и по убыванию, и по возрастанию в зависимости от значения true или false VUE JS

Сортировка и по убыванию, и по возрастанию в зависимости от значения true или false VUE JS

Нужно в зависимости от того, какой флаг у чекбокса true или false, сортировать массив по возрастанию числа и наоборот

111
Экспорт сайта в excel

Экспорт сайта в excel

на сайте находится несколько таблиц,в таблице одна колонка занимает изображение, данные в таблицу поступаю из бд через php, как мне экспортировать...

127
Как создать файл PDF из HTML кода или картинки в react-native используя expo?

Как создать файл PDF из HTML кода или картинки в react-native используя expo?

Как создать файл PDF из HTML кода или картинки в react-native используя expo?

124