使用chatgpt生成一个签证有效期在线计算器

最新推荐文章于 2024-08-23 06:00:00 发布

goodtools

最新推荐文章于 2024-08-23 06:00:00 发布

阅读量879

点赞数

文章标签： html css javascript

本文链接：https://blog.youkuaiyun.com/tool321_com/article/details/129623410

版权

示例页面，亲测chatgpt生成的代码可用，太强大了

https://www.goodtools.xyz/cn/t/visavalidity.php

一直困扰于计算方法，没想到几秒钟就做好了，太强大了。chatgpt生成的代码如下：

HTML：

```
<!DOCTYPE html>
<html>
<head>
    <title>计算签证有效期</title>
    <link rel="stylesheet" type="text/css" href="style.css">
</head>
<body>
    <div class="container">
        <h1>计算签证有效期</h1>
        <form>
            <label for="startDate">入境日期：</label>
            <input type="date" id="startDate">
            <label for="validDays">签证有效期：</label>
            <input type="number" id="validDays" placeholder="请输入签证有效期（天）">
            <button type="button" onclick="calculate()">计算</button>
        </form>
        <div id="result"></div>
    </div>

    <script src="app.js"></script>
</body>
</html>
```

CSS：

```
.container {
    max-width: 800px;
    margin: 0 auto;
    padding: 20px;
}

h1 {
    text-align: center;
}

form {
    margin-bottom: 20px;
}

label {
    display: inline-block;
    width: 120px;
}

input[type="date"], input[type="number"] {
    width: 200px;
    padding: 6px;
    border-radius: 4px;
    border: 1px solid #ccc;
}

button {
    padding: 6px 12px;
    background-color: #4CAF50;
    color: #fff;
    border: none;
    border-radius: 4px;
    cursor: pointer;
}

button:hover {
    background-color: #3e8e41;
}

#result {
    margin-top: 20px;
    font-size: 20px;
    text-align: center;
}
```

JavaScript：

```
function calculate() {
  const startDateInput = document.getElementById("startDate");
  const validDaysInput = document.getElementById("validDays");
  const startDate = new Date(startDateInput.value);
  const validDays = parseInt(validDaysInput.value);
  if (startDate && validDays) {
    const leavingDate = new Date(startDate.getTime() + validDays * 24 * 60 * 60 * 1000);
    const resultDiv = document.getElementById("result");
    resultDiv.innerHTML = `您应该在${leavingDate.getFullYear()}年${leavingDate.getMonth() + 1}月${leavingDate.getDate()}日前离境。`;
  } else {
    alert("请输入完整的信息。");
  }
}
```