Как вывести два одинаковых калькулятора, чтобы они не зависели друг от друга?

Question

[Dunno2018]

Здравствуйте.

Есть Калькулятор, который может выводиться на странице 2 и более раз, но с разными значениями data-атрибутов. Как сделать, чтобы они не зависели друг от друга?

Answer 1

[Stalker_RED]

Переписать его так, чтобы он искал не первые попавшиеся элементы на странице, а внутри нужного блока.

Answer 2

[0xD34F]

Заворачиваем код в $('.calculator').each, вместо поиска элементов по всему документу ограничиваемся текущим .calculator. Как-то так.

Comments

[Dunno2018]

0xD34F скажите, пожалуйста, а как в Вашем примере решить такой момент. Если вводить в поле сумму за пределами максимума и минимума, само число в input не вводится, но при этом подсчет с этим недопустимым числом производится.

[0xD34F]

Dunno2018, попробуйте заменить

$('.amount', this).on('input', e => {

на

$(this).on('input', '.amount', e => {

И для .amount2 аналогично.