Как обработать правильно input?

Question

[al3x4kovs]

<input type="text" id="num1">
<input type="text" id="num2">
<button id="button"> Кнопка</button>
<div id="next">Текст </div>

<script>
   document.getElementById('next').style.visibility="hidden";
    var a = document.getElementById('num1');
    var b = document.getElementById('num2');
    var count = a+b;
    document.getElementById('button').onclick = function() {
    if(count>=3){
      document.getElementById('next').style.visibility="visible";
    };
};
</script>

Есть 2 input, кнопка и div c id="next".
Задача: Если сумма 2 чисел из инпут подходят под условие, то открыть div c id="next".

Только начинаю изучать js и не смог нагуглить норм ответ.

Comments

[Владимир]

Не надо гуглить, просто сначала прочитайте
https://learn.javascript.ru/
или www.books.ru/books/javascript-podrobnoe-rukovodstv...

Answer 1

[Вячеслав]

1. Перенести все действия по суммированию внутрь обработчика щелчка.
2. Вы складываете два HTMLElement, что вы ожидаете получить? надо складывать их значения (value)

В итоге получится что-то такое:

document.getElementById('next').style.visibility="hidden";
   document.getElementById('button').onclick = function() {
   var a = document.getElementById('num1').value;
   var b = document.getElementById('num2').value;
   var count = parseInt(a, 10) + parseInt(b, 10);
    if(count>=3){
      document.getElementById('next').style.visibility="visible";
    };
};

Comments

[al3x4kovs]

Огромное спасибо!

Answer 2

[lega]

https://jsfiddle.net/r68b8f3e/