Как при клике на кнопку с помощью jquery проверить значение input и засунуть его в «дату» кнопки?

Есть такой html код:

<form class="cart">	
   <div class="quantity">
   <input type="number" id="5e7901376755e" class="qty"  name="quantity"   value="1" >
   </div>
<a rel="nofollow" href="#" data-quantity="1"  class="add_to_cart_button">В корзину</a>
</form>


Есть текущий обработчик, который при смене данных в поле ввода меняет данные у кнопки.

<script>
    jQuery(document).ready(function($) {
        $(document).on( 'change', '.quantity .qty', function() {
            $(this).parent('.quantity').next('.add_to_cart_button').attr('data-quantity', $(this).val());
        });
    });
</script>


Нужно изменить так, чтобы при нажатии на кнопку была проверка поля ввода и данные из него записывались в data-quantity этой же кнопки.

Пробую вот так, но не получается:

$(".add_to_cart_button").on('click input', function() {
                $(this).data('quantity', $(this).parent().find('input.qty').val() ); 
            });
  • Вопрос задан
  • 64 просмотра
Решения вопроса 1
@Stopy
Чтобы у тебя заработало, делай не
$(this).data('quantity', $(this).parent().find('input.qty').val() );

а
$(this).attr('data-quantity', $(this).parent().find('input.qty').val() );


Если хочешь понять почему у тебя работает не так, почитай вот тут документацию https://api.jquery.com/data/#data2
Description: Return arbitrary data associated with the first element in the jQuery collection, as set by data() or by an HTML5 data-* attribute.

Смысл в том что метод data() в jquery устанавливает значение в рамках своего хранилища, для переданного элемента, а не в атрибут html элемента. А при получении значения этим методом, возвращает в приоритете значение data атрибута элемента, а если его нет - ищет в своем хранилище.
Ответ написан
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы