|
@@ -0,0 +1,47 @@
|
|
|
+<!DOCTYPE html>
|
|
|
+<html lang="en">
|
|
|
+<head>
|
|
|
+ <meta charset="UTF-8">
|
|
|
+ <link rel="stylesheet" href="style.css">
|
|
|
+ <title>Title</title>
|
|
|
+</head>
|
|
|
+<body>
|
|
|
+ <select>
|
|
|
+ <option selected disabled>Выберите тип калькулятора</option>
|
|
|
+ <option value="1">Простой</option>
|
|
|
+ <option value="2">Сложный</option>
|
|
|
+ </select>
|
|
|
+ <label for="calc">Введите пример:</label>
|
|
|
+ <input id="calc">
|
|
|
+ <div id="result">Результат: </div>
|
|
|
+<script>
|
|
|
+ let select = document.querySelector('select'); // находим список
|
|
|
+ // событие, реагирующее на изменение списка (выбор простого или сложного калькулятора)
|
|
|
+ select.addEventListener('change',()=> {
|
|
|
+ let index = select.value; // переменная для хранения выбранного значения в списке
|
|
|
+ if (index==1) {
|
|
|
+ // событие, срабатывающее после нажатия клавиши Enter;
|
|
|
+ document.addEventListener('keydown', function (event) {
|
|
|
+ if (event.code=="Enter") {
|
|
|
+ let example = document.getElementById('calc').value; // значение внутри поля для ввода
|
|
|
+ let signIndexPlus = example.indexOf('+'); // индекс символа "+" в строке
|
|
|
+ // если плюс в строке найден:
|
|
|
+ if (signIndexPlus>0) {
|
|
|
+ let left = Number(example.substring(0,signIndexPlus)); // число, стоящее левее знака "+"
|
|
|
+ let right = Number(example.substring(signIndexPlus+1,example.length)); // число, стоящее правее знака "+"
|
|
|
+ let answer = left+right;
|
|
|
+ let result = document.querySelector("#result");
|
|
|
+ result.textContent="Результат: " + answer;
|
|
|
+ }
|
|
|
+ // дальше можно прописать систему условий на нахождение других арифметических знаков и дальнейший подсчет результата
|
|
|
+ }
|
|
|
+ })
|
|
|
+ }
|
|
|
+ if (index==2) {
|
|
|
+ // код для сложного калькулятора
|
|
|
+
|
|
|
+ }
|
|
|
+ })
|
|
|
+</script>
|
|
|
+</body>
|
|
|
+</html>
|