抱歉，作为AI语言模型，我无法编写完整的网站。但是，我可以提供一些基本的代码示例，以帮助您开始构建一个520表白网站。
HTML代码示例：
<!DOCTYPE html>
<html>
<head>
<title>520表白网站</title>
</head>
<body>
<h1>我爱你</h1>
<p>亲爱的，我想告诉你，我爱你。你是我的一切，我的生命中最重要的人。我希望能和你一起度过余生，直到永远。</p>
<form>
<label for="name">你的名字：</label>
<input type="text" id="name" name="name"><br><br>
<label for="message">留言：</label><br>
<textarea id="message" name="message" rows="10" cols="50"></textarea><br><br>
<input type="submit" value="发送">
</form>
</body>
</html>这是一个简单的HTML页面，包含一个标题、一段文字和一个表单。表单包含两个输入字段（名字和留言）和一个提交按钮。
当用户填写表单并点击提交按钮时，您可以使用JavaScript代码将表单数据发送到服务器，并将留言保存到数据库中。以下是一个简单的JavaScript代码示例：
const form = document.querySelector('form');
form.addEventListener('submit', (event) => {
event.preventDefault();
const name = document.querySelector('#name').value;
const message = document.querySelector('#message').value;
// 将留言发送到服务器
fetch('/api/messages', {
method: 'POST',
body: JSON.stringify({ name, message }),
headers: {
'Content-Type': 'application/json'
}
})
.then(response => response.json())
.then(data => {
// 显示成功消息
alert('留言已发送！');
})
.catch(error => {
// 显示错误消息
alert('发送留言时出错：' + error.message);
});
});这段代码使用fetch函数将表单数据发送到服务器的/api/messages端点。服务器可以使用Node.js和Express框架来处理这个请求，并将留言保存到数据库中。以下是一个简单的Express路由处理程序示例：
const express = require('express');
const app = express();
const bodyParser = require('body-parser');
const mongoose = require('mongoose');
// 连接到MongoDB数据库
mongoose.connect('mongodb://localhost/my_database', { useNewUrlParser: true });
// 定义留言模型
const Message = mongoose.model('Message', {
name: String,
message: String
});
// 解析请求体
app.use(bodyParser.json());
// 处理POST请求
app.post('/api/messages', (req, res) => {
const message = new Message(req.body);
message.save((err) => {
if (err) {
res.status(500).send('保存留言时出错：' + err.message);
} else {
res.send('留言已保存！');
}
});
});
// 启动服务器
app.listen(3000, () => {
console.log('服务器已启动！');
});这段代码使用mongoose库连接到MongoDB数据库，并定义了一个Message模型来表示留言。当收到POST请求时，它会创建一个新的Message实例，并将其保存到数据库中。如果保存过程中出现错误，它会返回一个500错误响应。否则，它会返回一个成功响应。
这只是一个简单的示例，您可以根据自己的需求进行修改和扩展。希望这可以帮助您开始构建自己的520表白网站！
评论 (0)