Как сделать добавление/удаление активному input Jquery?

Question

[nagge101]

Всем привет. Прошу помощи по реализации скрипта на jQuery.
Есть сайт, где верстка сайт

И так. Слева есть sidebar и в разделе стоимость есть 2 поля рейнджа.
Надо чтобы при клике на него оно становилось активным, этот момент я написал и сделать так, чтобы класс активности убирался при нажатии на любое место на сайте. Думаю схема понятна. Собственно вот сам код, который есть:

$('.amount, .amount_1').on('click', function() {
	$(this).addClass('active-amount-input');
});

<div class="amount">
input type="number" id="amount">
    </div>
<div class="amount_1">
    <input type="number" id="amount_1">
</div>

Прошу помощи!

Answer 1

[0xD34F]

$(document).on({
  focus() {
    $(this).addClass('active-amount-input');
  },
  blur() {
    $(this).removeClass('active-amount-input');
  },
}, '.amount, .amount_1');

или

$(document).on('focusin focusout', '.amount, .amount_1', e => {
  $(e.currentTarget).toggleClass('active-amount-input', e.type === 'focusin');
});

Comments

[nagge101]

Заменить или куда вставлять?

[nagge101]

Все, сделал, еще раз спасибо!)

Answer 2

[ThunderCat]

отслеживать клик на документ
проверять если таргет клика не содержит элементов инпута - на элементы инпута применяем ремовКласс("активный-класс");