Задать вопрос
@Pr1000000
javascript

Не работает кнопка вывода калькулятора. Выдает undefined. Что делать?

Написала калькулятор, все кнопки выводятся, как надо, но самая основная - кнопка вывода все время возвращает undefined. Возможно проблема в том, что не правильно сформулирована функция или eval.

(function () {
   let screen = document.querySelector('.screen');
   let buttons = document.querySelectorAll('.btn');
   let clear = document.querySelector('.btn-clear');
   let equal = document.querySelector('.btn-equal');
   let answer = '';

   buttons.forEach(function (button) {
      button.addEventListener('click', function (e) {
         let value = e.target.dataset.num;
         screen.value += value;
      })
   });


   let Result = () => {
      try {
         screen.value = eval(screen.value);
      }
      catch (err) {
         alert('Enter the valid input');
      }
   };



   clear.addEventListener('click', function (e) {
      screen.value = '';
   });

})();

<!DOCTYPE html>
<html lang="en">
<head>
   <meta charset="UTF-8">
   <meta http-equiv="X-UA-Compatible" content="IE=edge">
   <meta name="viewport" content="width=device-width, initial-scale=1.0">
   <link rel="stylesheet" href="style.css">
   <title>Document</title>
</head>
<body>
   <section class="calculator">
      <form>
         <input type="text" class="screen">
      </form>
      <div class="buttons">
         <button class="btn btn-yellow" data-num=""></button>
         <button class="btn btn-yellow" data-num="/">/</button>
         <button class="btn btn-yellow" data-num="+">+</button>
         <button class="btn btn-yellow" data-num="-">-</button>

         <button class="btn btn-grey" data-num="9">9</button>
         <button class="btn btn-grey" data-num="8">8</button>
         <button class="btn btn-grey" data-num="7">7</button>
         <button class="btn btn-grey" data-num="6">6</button>
         <button class="btn btn-grey" data-num="5">5</button>
         <button class="btn btn-grey" data-num="4">4</button>
         <button class="btn btn-grey" data-num="3">3</button>
         <button class="btn btn-grey" data-num="2">2</button>
         <button class="btn btn-grey" data-num="1">1</button>
         <button class="btn btn-grey" data-num="0">0</button>
         <button class="btn btn-grey" data-num=".">.</button>

         <button class="btn btn-equal" onclick="Result()">=</button>
         <button class="btn btn-clear">C</button>
      </div>
   </section>
   <script src="script.js"></script>
</body>
</html>
  • Вопрос задан
  • 140 просмотров
7 комментариев
Подписаться 1 Простой 7 комментариев
Пригласить эксперта
Ответы на вопрос 1
@JuniorHabr
;(function () {
let screen = document.querySelector('.screen')
let buttons = document.querySelectorAll('.btn')
let clear = document.querySelector('.btn-clear')
let equal = document.querySelector('.btn-equal')
let answer = ''

buttons.forEach(function (button) {
button.addEventListener('click', function (e) {
let value = e.target.dataset.num
if (value) {
screen.value += value
}
})
})

let Result = () => {
try {
screen.value = eval(screen.value)
} catch (err) {
alert('Enter the valid input')
}
}

clear.addEventListener('click', function (e) {
screen.value = ''
})

equal.addEventListener('click', () => {
Result()
})
})()

В разметке убрать онклик на кнопке btn-equal
Ответ написан
Комментировать
Комментировать
Ваш ответ на вопрос

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

Войти через центр авторизации
Похожие вопросы
Вакансии с Хабр Карьеры
JavaScript разработчик
SummerWeb • Ярославль
от 100 000 до 140 000 ₽
JavaScript разработчик
вАйТи
от 5 000 до 25 000 ₽
JavaScript Fullstack
OnClass
от 200 000 до 600 000 ₽
Ещё вакансии
Заказы с Хабр Фриланса
Доработать дизайн лендинга
25 апр. 2024, в 09:29
2500 руб./за проект
Сделать красивый лендинг в Тильде
25 апр. 2024, в 09:27
4000 руб./за проект
Создание видео. Моушен дизайн
25 апр. 2024, в 09:20
10000 руб./за проект
Ещё заказы