index3.html 1.1 KB

123456789101112131415161718192021222324252627282930
  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4. <meta charset="UTF-8">
  5. <meta http-equiv="X-UA-Compatible" content="IE=edge">
  6. <meta name="viewport" content="width=device-width, initial-scale=1.0">
  7. <title>Document</title>
  8. </head>
  9. <body>
  10. <!-- Calc Live
  11. Используя пример из задания Divide и функцию из Calc Func сделайте несколько полей ввода в HTML, меняя
  12. которые вы будете получать результат калькуляции в каком-то div. -->
  13. <label for="dayCount">How much time a day do you drink coffe?</label>
  14. <input type='number' id="dayCount" value="1" />
  15. <label for="duration">How many minutes does a coffee break last?</label>
  16. <input type='number' id="duration" value="1" />
  17. <div id="divisionResult">
  18. How many hours per year do you spend on coffee breaks?
  19. </div>
  20. <script>
  21. const calcFunc = () => {
  22. divisionResult.innerHTML = "You spend " + ((dayCount.value * duration.value * 365) / 60).toFixed(2) + " hours per year on coffee breaks";
  23. }
  24. dayCount.oninput = duration.oninput = calcFunc;
  25. </script>
  26. </body>
  27. </html>