Создание базового калькулятора с использованием JavaScript [закрыто]Javascript

Форум по Javascript
Ответить
Anonymous
 Создание базового калькулятора с использованием JavaScript [закрыто]

Сообщение Anonymous »

Я пытался создать базовый калькулятор функций с использованием HTML, CSS и JavaScript, и столкнулся с некоторыми проблемами.
Я создал функцию AppendToDisplay(), чтобы показывать значения на кнопках при нажатии, но функция не работает, я не знаю, ошибка ли это в моем HTML или в моем JavaScript.
Я также создал функцию Calculation() и функцию очистки, и они обе не активны.
Я новичок, поэтому, пожалуйста, будьте терпеливы.
Я также помню, что консоль продолжала говорить, что к «дисплею» нельзя получить доступ до инициализации, в то время как в моем отображении кода инициализация инициализируется до его использования в функции, или я ошибаюсь?

Код: Выделить всё

const display = document.getElementById("display");

function appendToDisplay(input) {
display.value += input;
}

function clearDisplay(){
display.value = "";
}

function calculate(){
try {
display.value = eval(display.value);
} catch (error) {
display.value = "Error";
}

}

Код: Выделить всё

/*calculator*/
#calculator{
width: 400px;
height: 675px;
background-color: black;
border-radius: 15px;
color: white;
font-family: Arial, Helvetica, sans-serif;
max-width: 500px;
}
#calculator input{
height: 200px;
width: 340px;
border-top-right-radius: 15px;
border-top-left-radius: 15px;
background-color: rgba(128, 128, 128, 0.233);
border: none;
text-align: right;
color:white;
font-size: 2rem;
}
.keys{
display: grid;
grid-template-columns: repeat(4, 1fr);
gap: 13px;
padding: 10px;
margin: 8px;
}
#display{
width: 100%;
color:white;
padding: 30px;
font-size: 2rem;
text-align: left;
border:none;
}
#calculator button{
width: 65px;
height: 65px;
font-size: 2rem;
border-radius: 50%;
background-color:rgba(128, 128, 128, 0.233);
color: white;
border:none;
font-weight: 200;
box-shadow: 0px 2px 8px #ccccccde;
}
#calculator button:hover{
background-color: rgba(128, 128, 128, 0.836);
}
#calculator .op{
background-color: rgba(255, 166, 0, 0.884);
}
#calculator .op:hover{
background-color:  rgb(255, 166, 0);
}

Код: Выделить всё





Js project minis







+
7
8
9
-
4
5
6
*
1
2
3
/
0
.
=
C








Подробнее здесь: https://stackoverflow.com/questions/798 ... javascript
Ответить

Быстрый ответ

Изменение регистра текста: 
Смайлики
:) :( :oops: :roll: :wink: :muza: :clever: :sorry: :angel: :read: *x)
Ещё смайлики…
   
К этому ответу прикреплено по крайней мере одно вложение.

Если вы не хотите добавлять вложения, оставьте поля пустыми.

Максимально разрешённый размер вложения: 15 МБ.

Вернуться в «Javascript»