Strona główna Odkrywaj Pomoc
Zaloguj się
Vladimir-Grabarev
/
A-level_homework
Obserwuj 1
Polub 0
Forkuj 0
Pliki Problemy 0 Oczekujące zmiany 0 Wiki
Przeglądaj źródła

HW <01> Отладка, переменные done

Vladimir 3 lat temu
commit
69ffdf6ce2
4 zmienionych plików z 118 dodań i 0 usunięć
Zunifikowany widok Pokaż statystyki zmian
  1. 40 0
      HW 01/calc.js
  2. 50 0
      HW 01/index.html
  3. 21 0
      HW 01/login.js
  4. 7 0
      HW 01/style.css

+ 40 - 0
HW 01/calc.js
Wyświetl plik 

@@ -0,0 +1,40 @@
 
+const AMOUNT = 1000; //Младший вес от старшего отличается на 1000, т.к. эта цифра не меняется я объявил ее как константу
 
+
 
+let firstInput  = document.querySelector("#first-input"); //Нашел первый инпут в который пользователь будет вводить данные для дальнейшей работы
 
+let secondInput = document.querySelector("#second-input"); //Нашел второй инпут, по анологии с первым
 
+let firstType   = document.querySelector("#first-type"); //Select, пользователь будет выбирать тип веса для первого инпута
 
+let secondType  = document.querySelector("#second-type"); //Select для выбора веса второго инпута
 
+
 
+let countFirstWeight = function() { // Функция которая переводит вес первого инпута во второй инпут
 
+    let number = firstInput.value;
 
+
 
+    for(let i = 0; i < firstType.selectedIndex; i++) { // Счетчик, тут я смотрю какой тип выбрал пользователь и перевожу его вес в милиграмы
 
+        number *= AMOUNT;
 
+    }
 
+    for(let i = 0; i < secondType.selectedIndex; i++) { // Перевожу милиграмы из первого счетчика в вес который выбран во втором инпуте
 
+        number /= AMOUNT;
 
+    }
 
+
 
+    secondInput.value = number; // Вывожу полученое число во второй инпут
 
+};
 
+
 
+let countSecondWeight = function() { // Аналогичная функция, перевожу вес второго инпута в первый
 
+    let number = secondInput.value;
 
+
 
+    for(let i = 0; i < secondType.selectedIndex; i++) {
 
+        number *= AMOUNT;
 
+    }
 
+    for(let i = 0; i < firstType.selectedIndex; i++) {
 
+        number /= AMOUNT;
 
+    }
 
+
 
+    firstInput.value = number;
 
+}
 
+
 
+
 
+// Запуск функций countFirstWeight и countSecondWeight при изменениях в инпутах
 
+
 
+firstInput.addEventListener("input", countFirstWeight);
 
+secondInput.addEventListener("input", countSecondWeight);
 
+firstType.addEventListener("input", countFirstWeight);
 
+secondType.addEventListener("input", countSecondWeight);

+ 50 - 0
HW 01/index.html
Wyświetl plik 

@@ -0,0 +1,50 @@
 
+<!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 class="body">
 
+    <div class="calc">
 
+        <h1>Конвертер веса</h1>
 
+        <div>
 
+            <input type="number" id="first-input" size="1" value="1">
 
+            <select id="first-type">
 
+                <option value="Milligram">Миллиграмм</option>
 
+                <option value="Gram">Грамм</option>
 
+                <option value="Kilogram" selected>Килограмм</option>
 
+                <option value="Ton">Тонна</option>
 
+            </select>
 
+        </div>
 
+        <div>
 
+            <input type="number" id="second-input" size="1" value="1000">
 
+            <select id="second-type">
 
+                <option value="Milligram">Миллиграмм</option>
 
+                <option value="Gram" selected>Грамм</option>
 
+                <option value="Kilogram">Килограмм</option>
 
+                <option value="Ton">Тонна</option>
 
+            </select>
 
+        </div>
 
+    </div>
 
+    <div class="login">
 
+        <h1>Форма логина</h1>
 
+        <p>Введите ваш логин и пароль, пожалуйста (</p>
 
+        <form class="form">
 
+            <p>
 
+                <label for="login">Логин</label>
 
+                <input type="login" id="login">
 
+            </p>
 
+            <p>
 
+                <label for="password">Пароль</label>
 
+                <input type="password" name="" id="password">
 
+            </p>
 
+            <button type="submit">Вход</button>
 
+        </form>
 
+    </div>
 
+    <script src="calc.js"></script>
 
+    <script src="login.js"></script>
 
+</body>
 
+</html>

+ 21 - 0
HW 01/login.js
Wyświetl plik 

@@ -0,0 +1,21 @@
 
+var credentials = {
 
+    login: 'admin',
 
+    password: 'qwerty',
 
+};
 
+
 
+//Нахожу все элементы с которыми буду работать
 
+let login    = document.querySelector("#login");
 
+let password = document.querySelector("#password");
 
+let form     = document.querySelector(".form");
 
+
 
+//Функция которая проверяет правильно ли введены логин и пароль
 
+let checkPersonalData = function() {
 
+    if(login.value == credentials.login && password.value == credentials.password) {
 
+        alert("Жесть, все верно, добро пожаловать !!!");
 
+    } else {
 
+        alert("Жесть, что то не верно, попробуй еще раз");
 
+    }
 
+};
 
+
 
+//Запуск функции checkPersonalData при отправки формы
 
+form.addEventListener("submit", checkPersonalData);

+ 7 - 0
HW 01/style.css
Wyświetl plik 

@@ -0,0 +1,7 @@
 
+.green {
 
+    background-color: greenyellow;
 
+}
 
+
 
+.red {
 
+    background-color: red;
 
+}