### 回答1：
要建立
数据库并显示，需要使用服务器端编程语言，如PHP或Python。这里简单介绍一下使用PHP的方法：
1. 创建
HTML表单，包含输入
数据和提交按钮。例如：
```
html
<form method="post" action="create_db.php">
<label for="name">姓名：</label>
<input type="text" id="name" name="name"><br>
<label for="age">年龄：</label>
<input type="number" id="age" name="age"><br>
<input type="submit" value="提交">
</form>
```
2. 创建服务器端PHP文件 create_db.php，用于处理提交的表单
数据。例如：
```php
<?php
// 连接
数据库
$servername = "localhost";
$username = "root";
$password = "";
$dbname = "myDB";
$conn = new mysqli($servername, $username, $password, $dbname);
if ($conn->connect_error) {
die("连接失败: " . $conn->connect_error);
}
// 获取表单
数据
$name = $_POST["name"];
$age = $_POST["age"];
// 创建
数据库表
$sql = "CREATE TABLE MyGuests (
id INT(6) UNSIGNED AUTO_INCREMENT PRIMARY KEY,
name VARCHAR(30) NOT NULL,
age INT(3) NOT NULL
)";
if ($conn->query($sql) === TRUE) {
echo "表 MyGuests 创建成功";
} else {
echo "错误: " . $sql . "<br>" . $conn->error;
}
// 插入
数据
$sql = "INSERT INTO MyGuests (name, age)
VALUES ('$name', $age)";
if ($conn->query($sql) === TRUE) {
echo "
数据插入成功";
} else {
echo "错误: " . $sql . "<br>" . $conn->error;
}
// 显示
数据
$sql = "SELECT * FROM MyGuests";
$result = $conn->query($sql);
if ($result->num_rows > 0) {
while($row = $result->fetch_assoc()) {
echo "id: " . $row["id"]. " - Name: " . $row["name"]. " - Age: " . $row["age"]. "<br>";
}
} else {
echo "0 结果";
}
$conn->close();
?>
```
3. 运行代码并测试。将
HTML文件和PHP文件
保存在服务器上，然后在浏览器
中打开
HTML文件，输入
数据并提交。PHP文件将创建名为“myDB”的
数据库，并在其
中创建名为“MyGuests”的表格，然后将输入的
数据插入表格
中，并将
数据显示在
页面上。
### 回答2：
要实现在
HTML中输入
数据后
点击按钮，建立
数据库并显示，需要借助后端开发语言和
数据库。
首先，在
HTML中添加输入框和按钮，并使用
JavaScript获取用户输入的
数据。例如：
```
html
<!DOCTYPE
html>
<
html>
<head>
<title>建立
数据库并显示</title>
</head>
<body>
<input type="text" id="inputData" placeholder="输入
数据">
<button onclick="saveData()">
保存数据</button>
<div id="outputData"></div>
<script>
function saveData() {
var inputData = document.getElementById("inputData").value;
// 将
数据发送至后端进行处理
}
</script>
</body>
</
html>
```
接下来，需要选择一种后端开发语言和
数据库。例如，使用PHP作为后端开发语言，MySQL作为
数据库。
在后端，需要接收
前端发来的
数据，并将其
保存至
数据库。例如，使用PHP连接
数据库并
保存数据：
```php
<?php
$servername = "localhost";
$username = "用户名";
$password = "密码";
$dbname = "
数据库名";
// 创建连接
$conn = new mysqli($servername, $username, $password, $dbname);
// 检查连接是否成功
if ($conn->connect_error) {
die("连接失败: " . $conn->connect_error);
}
// 接收来自
前端的
数据
$inputData = $_POST['inputData'];
// 将
数据保存至
数据库中的表格
$sql = "INSERT INTO 表格名 (字段名) VALUES ('$inputData')";
if ($conn->query($sql) === TRUE) {
echo "
数据保存成功";
} else {
echo "
数据保存失败: " . $conn->error;
}
$conn->close();
?>
```
最后，在
前端的
JavaScript代码
中，使用AJAX将用户输入的
数据发送至后端进行处理，并将处理结果显示在
页面上。
```
javascript
function saveData() {
var inputData = document.getElementById("inputData").value;
// 创建XMLHttpRequest对象
var xhr = new XMLHttpRequest();
// 定义回调函数
xhr.onreadystatechange = function () {
if (xhr.readyState == 4 && xhr.status == 200) {
document.getElementById("outputData").inner
HTML = xhr.responseText;
}
};
// 发送
数据至后端进行处理
xhr.open("POST", "后端处理
数据的PHP文件路径", true);
xhr.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
xhr.send("inputData=" + inputData);
}
```
这样，当用户在输入框
中输入
数据后，
点击按钮就能将
数据保存至
数据库，并将
保存结果显示在
页面上。
### 回答3：
要实现在
HTML页面中输入
数据后
点击按钮建立
数据库并显示的功能，你需要结合使用
HTML、
JavaScript和后端
数据库技术来完成。
首先，在
HTML页面中创建一个表单，包含可以输入
数据的文本框和一个提交按钮。例如：
```
html
<form>
<input type="text" id="inputData">
<button onclick="createDatabase()">建立
数据库</button>
</form>
```
接下来，在
JavaScript中定义一个函数`createDatabase()`来处理
点击按钮的事件。在该函数
中，你可以获取用户输入的
数据，并将其存储到后端
数据库中。具体来说，你可以使用AJAX技术来将
数据发送到后端服务器，然后由服务器将
数据存储到
数据库中。以下是一个简单的示例：
```
javascript
function createDatabase() {
var inputData = document.getElementById("inputData").value;
// 使用AJAX将
数据发送到后端服务器
var xhr = new XMLHttpRequest();
xhr.open("POST", "/saveData", true);
xhr.setRequestHeader("Content-Type", "application/json");
xhr.onreadystatechange = function() {
if (xhr.readyState === 4 && xhr.status === 200) {
//
数据存储成功后的处理逻辑
var response = JSON.parse(xhr.responseText);
if (response.success) {
// 显示成功消息或刷新
数据列表等操作
console.log("
数据存储成功！");
} else {
// 显示失败消息或处理错误情况
console.log("
数据存储失败：" + response.error);
}
}
};
xhr.send(JSON.stringify({data: inputData}));
}
```
最后，在后端服务器上处理`POST /saveData`请求，并将
数据存储到
数据库中。这里假设你使用了Node.js和MongoDB作为后端技术栈。以下是一个简单的Express路由处理器的示例：
```
javascript
app.post("/saveData", (req, res) => {
var inputData = req.body.data;
// 将
数据存储到
数据库，这里假设使用了Mongoose库
YourModel.create({data: inputData}, (err, savedData) => {
if (err) {
res.json({success: false, error: err.message});
} else {
res.json({success: true});
}
});
});
```
通过上述步骤，你可以实现在
HTML页面输入
数据后
点击按钮建立
数据库并显示的功能。请注意根据实际情况适当进行
修改和调整。
最低0.47元/天 解锁文章
712
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
