Как при изменении инпута в форме выводить сразу же результат вычисления?

Question

[Neocaridina]

Например

<label>Выберите тип
<select id="PROD">
<option value="1000">Мини</option>
<option value="2000">Оптим</option>
<option value="3000">Макси</option>
</select>
</label>
<label>Количество: <input id="COUNT" type="number"></label>
<p>Результат: <b id="RESULT"></p>

Как вывести результат умножения PROD на COUNT в RESULT при помощи КНОПКИ знаю (нагуглил)
А как выводить результат динамически, чтоб он менялся сразу же при переключении опции или изменении цифры?
Буду благодарен за пример или хотябы ссылку

Answer 1

[Владимир Проскурин]

вешаешь на событие onchange селекта вместо onclick кнопки

Answer 2

[Станислав Шендаков]

С JQuery

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<label>Выберите тип
<select id="PROD">
<option value="1000">Мини</option>
<option value="2000">Оптим</option>
<option value="3000">Макси</option>
</select>
</label>
<label>Количество: <input id="COUNT" type="number"></label>
<p>Результат: <b id="RESULT"></p>

$( function()
{
  $('#PROD').bind('change', change )
  $('#COUNT').bind('change', change )  
});

function change()
{
  var type = $( '#PROD option:selected' ).val();
  var count = $( '#COUNT' ).val();
  $( '#RESULT' ).text( count * type );
}

То-же самое, но покороче:

$( function()
{
  $('#PROD, #COUNT').bind('change', 
    function() {
      $( '#RESULT' ).text( $( '#PROD option:selected' ).val() * $( '#COUNT' ).val() );
              })
});

Можно на чистом JavaScript. Будет длиннее, но смысл не изменится.

Comments

[Neocaridina]

Да, jquery сила.
Оказывается можно сделать так:

$('#PROD, #COUNT').bind('change click keypress keydown mouseenter mouseup mousedown mouseleave hover keyup focus blur', .......

вроде ничего не забыл для полной динамики...

[Станислав Шендаков]

Neocaridina, Так Вам шашечки, или ехать? :)

[Neocaridina]

Так на одном change далеко не заедешь.
А сейчас уже при вводе данных результат считается сразу.
То что я и хотел. Спасибо