HTML,写一个查询,文本框输入值,点击查询带入http://xmairavt7.xiamenair.com/WarningPage?WarningAirports=变量,输出到下面文本框中
时间: 2024-09-25 13:04:56 浏览: 36
django.pdf
HTML是一种标记语言,用于创建网页结构。如果你想在HTML页面上创建一个简单的查询功能,可以使用`<input>`标签作为文本框,`<button>`标签作为查询按钮,以及`<textarea>`标签显示结果。下面是一个基本示例:
```html
<!DOCTYPE html>
<html lang="zh">
<head>
<meta charset="UTF-8">
<title>查询示例</title>
</head>
<body>
<label for="searchInput">请输入机场代码:</label>
<input type="text" id="searchInput" name="warningAirports">
<button onclick="getWarningData()">查询</button>
<hr>
<label for="result">查询结果:</label>
<textarea id="result" rows="4" cols="50" readonly></textarea>
<script>
function getWarningData() {
var inputVal = document.getElementById("searchInput").value;
if (inputVal) {
var url = "http://xmairavt7.xiamenair.com/WarningPage?WarningAirports=" + encodeURIComponent(inputVal);
fetch(url)
.then(response => response.text())
.then(data => {
document.getElementById("result").value = data;
})
.catch(error => console.error("获取数据失败:", error));
} else {
alert("请输入机场代码");
}
}
</script>
</body>
</html>
```
在这个例子中,用户在文本框中输入机场代码,点击查询按钮会发起一个GET请求,将输入值动态添加到URL中。然后,服务器返回的数据会被赋值给下方的文本框。
阅读全文