Хорошие посты про Data Science в одной коллекции
Задать вопрос
Trailaptor
@Trailaptor
Новичок в web-программировании
javascript

В чем проблема js калькулятора?

В js новичок
Наверное странный способ сделать калькулятор. Просто хочу разобраться с темой.
Вроде всё сделал правильно, ошибок в консоли не дает.
Возможно ошибка в html с тем, что onchange не правильно поставлен.
А может не туда скрипт присоединил в html файле, но alert работает
Помогите, пожалуйста
ссылка на JSFiddle
let fst = document.getElementById('idinp').value;
let scnd = document.getElementById('select').value;
let thrd = document.getElementById('idinp2').value;

function f1() {

 	if (scnd == '+') {
 		var result = fst + thrd;
 		document.getElementById('idresult').innerHTML = result
 	}

 	else if (scnd == '-') {
 		var result = fst - thrd;
 		document.getElementById('idresult').innerHTML = result
 	}

 	else if (scnd == '*') {
 		var result = fst * thrd;
 		document.getElementById('idresult').innerHTML = result
 	}

 	else{
 		var result = fst / thrd;
 		document.getElementById('idresult').innerHTML = parseInt(result)
 	}
}

f1()


<html>


<head>

    <link rel="stylesheet" type="text/css" href="style.css">

 </head>



<body>

	<div class="container">
		
		<div class="input-div">
			<p class="p">Первое значение:</p>
			<input id="idinp" class="inp1">
		</div>


		<div class="input-div" id="select-div">
			<p class="p">Операция:</p>
			<select class="select inp" id="select">
				<option id="idplus" class="inp">+</option>
				<option id="idminus" class="inp">-</option>
				<option id="idmult" class="inp">*</option>
				<option id="iddiv" class="inp">/</option>
			</select>

		</div>

		<div class="input-div" id="input2-div">
			<p class="p">Второе значение:</p>
			<input id="idinp2" class="inp1" onchange="f1()">
		</div>

		<div class="input-div" id="output-div">
			<p class="p">Результат:</p>
			<input id="idresult" class="out1 inp1" onchange="f1()">
		</div>

	</div>




	<script src="Путь\script.js"></script> <!--alert работает-->
</body>
</html>


  • Вопрос задан
  • 129 просмотров
2 комментария
Подписаться 1 Простой 2 комментария
Решения вопроса 2
@lexchz
Не работает, т.к. функция выполняется при загрузке страницы. Повесь выполнение f1() на событие input, как вариант.
Ответ написан
4 комментария
Нравится 2 4 комментария
NevePMoPe
@NevePMoPe
С событием траблы
Ответ написан
Комментировать
Нравится 1 Комментировать
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы
Вакансии с Хабр Карьеры
HTML Верстальщик / Frontend разработчик
Light
от 75 000 до 90 000 ₽
JavaScript-разработчик
CORE
от 230 000 ₽
Автор профессиональных курсов по HTML
HTML Academy • Санкт-Петербург
от 100 000 до 150 000 ₽
Ещё вакансии
Заказы с Хабр Фриланса
Проектирование базы данных и разработка REST API
27 янв. 2021, в 00:37
11111 руб./за проект
Сделать новый дизайн mini apps VK
26 янв. 2021, в 23:30
3000 руб./за проект
Сайт для отслеживания посылок
26 янв. 2021, в 23:07
1000 руб./за проект
Ещё заказы