输入时间自动计算小时网页输入时间自动生成日期和时间

货源人·学电商2个月前 (07-17)跨境平台

<!DOCTYPE html><html lang="zh"><head>    <meta charset="UTF-8">    <meta name="viewport" content="width=device-width, initial-scale=1.0">    <title>自动计算小时</title></head><body>    <h1>自动计算小时</h1>    <form action="">        <label for="hours">请输入小时数：</label>        <input type="number" id="hours" name="hours" min="0" max="24">        <br>        <label for="minutes">请输入分钟数：</label>        <input type="number" id="minutes" name="minutes" min="0" max="59">        <br>        <button type="submit">计算小时</button>    </form>    <p>计算结果：<span id="result"></span></p>    <script>        document.getElementById("result").innerHTML = "";        function calculateHours() {            const hours = parseInt(document.getElementById("hours").value);            const minutes = parseInt(document.getElementById("minutes").value);            if (isNaN(hours) || isNaN(minutes)) {                alert("请输入有效的小时和分钟数！");                return;            }            const totalMinutes = hours * 60 + minutes;            const result = totalMinutes / 60;            document.getElementById("result").innerHTML = `${result}小时`;        }        document.getElementById("hours").addEventListener("change", calculateHours);        document.getElementById("minutes").addEventListener("change", calculateHours);    </script></body></html>

这是一个使用HTML、CSS和JavaScript编写的简单网页，用于自动计算给定小时数的小时。用户可以在表单中输入小时数和分钟数，点击“计算小时”按钮后，页面会显示计算出的小时数。