写一个查询类html模板写一个查询类html模板
时间: 2024-10-10 07:04:54 浏览: 10
在创建一个简单的HTML查询表单模板时,我们通常会包含一个表单结构,用户可以输入查询条件,并提交请求到服务器。下面是一个基础的查询类HTML模板示例:
```html
<!DOCTYPE html>
<html lang="zh">
<head>
<meta charset="UTF-8">
<title>查询页面</title>
</head>
<body>
<!-- 查询表单 -->
<form id="queryForm" action="/api/query" method="GET">
<h2>请输入查询条件:</h2>
<label for="keyword">关键词:</label>
<input type="text" id="keyword" name="keyword" required><br><br>
<label for="dateRange">日期范围 (YYYY-MM-DD):</label>
<input type="date" id="startDate" name="start_date">
<input type="date" id="endDate" name="end_date"><br><br>
<!-- 其他查询选项,比如下拉列表或复选框 -->
<label for="category">类别:</label>
<select id="category" name="category">
<option value="all">所有</option>
<option value="option1">选项1</option>
<option value="option2">选项2</option>
</select><br><br>
<button type="submit">搜索</button>
</form>
<div id="resultPlaceholder" style="display:none;">
<p>搜索结果将显示在这里...</p>
</div>
<script>
// JavaScript代码用于处理表单提交和验证(如果需要)
</script>
</body>
</html>
```
在这个模板中,用户填写关键词、选择日期范围以及可能的其他过滤条件。当用户点击“搜索”按钮时,`GET` 请求会被发送到指定的URL `/api/query`,携带表单数据。
阅读全文