Как обновить данные инпута с кнопками +-?

Question

[alex88a]

Добрый день. Суть такая, при значении инпута выводится блок. Если ввожу, то все нормально. Но с кнопками + - не срабатывает это. Подскажите, в какую сторону копать то?

<div id="messages"></div>
              <button type="button" id="superminus" class="main-color1">
                <span class="icon-minus"><i class="fa fa-minus"></i></span>
              </button>
              <button type="button" id="superplus"  class="main-color1">
                <span class="icon-plus"><i class="fa fa-plus"></i></span>
              </button>
          <input type="text" name="quantity" value="" maxlength="4" class="plus-minus">

$('#superminus').click( function() { 
  var cols = $(".plus-minus").val();
  if (cols > 1 ){$(".plus-minus").val(cols - 1)};
});
$('#superplus').click( function() { 
  var num = +$(".plus-minus").val() + 1;
  $(".plus-minus").val(num);
});

var input = document.querySelector('.plus-minus');

var messages = document.querySelector('#messages');
var a=<?php echo $perem; ?>;

input.addEventListener('input', function()
{

if (input.value <= a) {
 messages.textContent = 'Текст1: ' + input.value + '\n';
} else {
document.querySelector('.plus-minus').value = a ;
messages.textContent = 'Текст2: ' + input.value + '\n';
  
}
 
});

Comments

[alex88a]

забыл добавить, кнопки +- добавляют значение, но сам текст messages не выводится

[0xD34F]

с кнопками + - не срабатывает

Не срабатывает ЧТО? Вы не показали никакого кода, отвечающего за обработку нажатий на кнопки.

[alex88a]

0xD34F,

$('#superminus').click( function() { 
	var cols = $(".plus-minus").val();
	if (cols > 1 ){$(".plus-minus").val(cols - 1)};
});
$('#superplus').click( function() { 
	var num = +$(".plus-minus").val() + 1;
	$(".plus-minus").val(num);
});

такой

[0xD34F]

alex88a, вы это в текст вопроса добавьте. Заодно уберите тэг html и "добрый день".

[Tim]

alex88a, а что с кнопками не так? Какой результат получили и какой ожидаете?

Answer 1

[v3shin]

После изменения значения применяйте

dispatchEvent(new Event('input', {
    bubbles: true,
    cancelable: true,
}));

$('...').trigger('input') может не сработать.