@NeonCoder

Пишу свой первый калькулятор. Не могу понять, что я делаю не так?

Ничего не выводит. В чём ошибка?
Вот HTML
<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Calculator</title>
	<link rel="stylesheet" type="text/css" href="main.css">
	<script src="script.js"></script>
</head>
<body>
	<div class="calc-container">
		<input type="number" placeholder="0" id="output">
		<div class="buttons">
		    <button id="C" class="btn" value="C">C</button>
		    <button id="()" class="btn" value="()">()</button>
		    <button id="%" class="btn" value="%">%</button>
		    <button id="÷" class="btn yellow" value="÷">÷</button>
		</div>
		<div class="buttons">
				<button id="7" class="btn" value="7" onclick="click(7)">7</button>
		        <button id="8" class="btn" value="8" onclick="click(8)">8</button>
		        <button id="9" class="btn" value="9" onclick="click(9)">9</button>
		    <button id="×" class="btn yellow" value="×">×</button>    
		</div>
		<div class="buttons">
				<button id="4" class="btn" value="4" onclick="click(4)">4</button>
		        <button id="5" class="btn" value="5" onclick="click(5)">5</button>
		        <button id="6" class="btn" value="6" onclick="click(6)">6</button>
		    <button id="-" class="btn yellow" value="-">-</button>    
		</div>
		<div class="buttons">
				<button id="1" class="btn" value="1" onclick="click(1)">1</button>
		        <button id="2" class="btn" value="2" onclick="click(2)">2</button>
		        <button id="3" class="btn" value="3" onclick="click(3)">3</button>
		    <button id="+" class="btn yellow" value="+">+</button>    
		</div>
		<div class="buttons">
				<button id="zero" class="btn" value="0" onclick="click()">0</button>
		    <button id="." class="btn" value=".">.</button>
		    <button id="=" class="btn yellow" value="=">=</button>    
		</div>
	</div>
</body>
</html>

Вот JS
var out = document.getElementById('output');

function click(num) {
	alert(num);
}
  • Вопрос задан
  • 207 просмотров
Пригласить эксперта
Ответы на вопрос 3
KorniloFF
@KorniloFF Куратор тега JavaScript
Работаю по font-end / JS
С такого ужаса учиться начинать нельзя!
Хотя бы так для начала - пример: https://codepen.io/KorniloFF/pen/mvjwXx
Ответ написан
sergiks
@sergiks Куратор тега JavaScript
♬♬
У вас неудачно выбрано имя функции click() – есть метод с таким же названием у document.body. Попробуйте написать для какой-нибудь кнопки
onclick="console.log(document.body.click === click);"

Откройте консоль браузера и нажмите ту кнопку: выведет true.

В общем, быстрое решение: назовите вашу функцию click() как-то иначе, и пропишите ее новое название везде в onclick. Вот ваш код, где заменили только имя функции с click на myclick, работает:


Но прописывать в HTML каждой onclick – дурной тон нынче. (Если только вы не Vue.js : )

По-хорошему надо слушать события клика (они поднимаются наверх пузыриками), и обрабатывать, в зависимости от кликнутой кнопки. Примерно так:
Ответ написан
dimovich85
@dimovich85 Куратор тега JavaScript
https://u-academy.net/
Никто событие клик не слушает. Помимо этого надо еще и с объектом события и с контекстом вызова разобраться.
https://learn.javascript.ru/events-and-interfaces
https://learn.javascript.ru/document
Ответ написан
Ваш ответ на вопрос

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

Похожие вопросы