Как ограничить счетчик минимальным значением 1 и максимальным 100?

Question

[maxpisya]

$(document).ready(function() {
    $('.minus.basket-quantity__btn').click(function() {
      $(this).siblings('.basket-quantity__num').html(+$(this).siblings('.basket-quantity__num').html()-1);
      $(this).parents('.content').find('.price .num').html(+$(this).parents('.content').find('.price .num').html()-2830);
    });
    $('.plus.basket-quantity__btn').click(function() {
      $(this).siblings('.basket-quantity__num').html(+$(this).siblings('.basket-quantity__num').html()+1);
      $(this).parents('.content').find('.price .num').html(+$(this).parents('.content').find('.price .num').html()+2830);
    });
  });

Answer 1

[0xD34F]

$(document).on('click', '.basket-quantity__btn', function() {
  const $this = $(this);
  const step = +$this.hasClass('plus') || -$this.hasClass('minus');
  const val = $this
    .siblings('.basket-quantity__num')
    .text((i, text) => Math.max(1, Math.min(100, +text + step)))
    .text();

  $(this)
    .closest('.content')
    .find('.price .num')
    .html(val * 2830);
});

Comments

[maxpisya]

а как это с $('.basket-quantity__num') этим объединить?

[0xD34F]

Скажите, код, показанный вами в тексте вопроса - вы его сами писали, или кто-то сделал это за вас?

[maxpisya]

0xD34F, за меня). Я только значения менял

[0xD34F]

Ответ обновил.

[maxpisya]

0xD34F, спасибо

Answer 2

[Exploding]

Что вы делаете, люди!!?? Покайтесь!!)))
<input type='number' min='1' max='100'>

А ежели дофига эстет - пожалуйста, с кастомными контролами:

<div class='icon-remove cart-pm'></div>
<input type='number' min='1' max='100' step='1' value='1'>
<div class='icon-add cart-pm'></div>

Но проще даже в onclick-е элемента юзать методы stepUp и stepDown

$(document).on("click", ".cart-pm", function(){
	var input = $(this).siblings("[type='number']");
	if($(this).hasClass("icon-add")) input[0].stepUp();
	else input[0].stepDown();
});

Comments

[maxpisya]

Госпади, спасибо!

Answer 3

[Дмитрий Дерепко]

Берите в обработчике клика и проверяйте значение
$(this).siblings('.basket-quantity__num').html()

А вообще, лучше выносить одинаковые куски кода в промежуточные переменные.