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

Question

[Max Rudik]

Добрый вечер!
Есть абсолютно рабочий скрипт калькулятора, который будучи подключен к данной форме
https://jsfiddle.net/j58qhb9o/
почему-то ведет себя странно: выводит на долю секунды правильный результат и сбрасывает все поля формы. Пробовал прописать method = "POST" в форме, но это не помогло.
Что-то не так с формой или даже скорее с остальной версткой, т.к. форма отдельно работает корректно.

Answer 1

[Jack_Taylor]

Дело в том, что кнопка "Рассчитать" отправляет форму с id="calculator" (не совсем понятно, зачем эта форма вообще нужна). Это происходит потому, что помимо того обработчика, который вы на эту кнопку поставили (функция, расчитывающая значение) у кнопки есть еще и обработчик по умолчанию - отправить данные формы, в которой она находится, на сервер (по адресу, указанному в атрибуте action, способом, указанным в атрибуте method). Чтобы ваш обработчик стал последним (то есть сказать кнопке "все, больше ничего не делай и вообще забудь, что тебя нажимали") - нужно в конце вашего обработчика добавить return false;

Вот поправленный фиддл:
https://jsfiddle.net/fph4zxqy/1/

Comments

[Max Rudik]

Спасибо огромное, выручили!

Answer 2

[333Serega333 333Serega333]

Кнопка "Рассчитать" отправляет форму. Можно написать так:
<form id = "calculator" onsubmit="return false;">
Тогда форма не будет отправляться

Comments

[Max Rudik]

Большое спасибо!!!