<head> <meta charset="UTF-8"> <title>欢迎登录</title> <script src="https://cdn.bootcss.com/jquery/3.4.1/jquery.min.js"></script> <script> $(document).ready(function() { // 查询按钮点击事件 $("#search-btn").click(function() { // 获取用户输入的查询信息 var flightNum = $("#flight-num").val(); var date = $("#date").val(); // 发送请求给后端 $.ajax({ url: "/flightQuery", type: "GET", data: { "flightNum": flightNum, "date": date }, success: function(data) { // 将查询结果显示在中间框中 $("#result").html(data); } }); }); // 退出按钮点击事件 $("#logout-btn").click(function() { // 跳转到首页 window.location.href = "/"; }); }); </script> </head> <body> <h1>民航航班查询</h1> <div> <label>航班号:</label> <input type="text" id="flight-num"> <br> <label>日期:</label> <input type="date" id="date"> <br> <button href="user-login-form" id="search-btn">查询</button> </div> <hr> <div id="result"></div> <hr> <button id="logout-btn">退出</button> </body> </html>
时间: 2024-02-06 19:02:13 浏览: 135
socket.io认证,nodejs实现socket.io demo(server/client)
这是一个简单的 HTML 页面,包含一个航班查询功能和一个退出按钮。页面中引用了 jQuery 库。
页面中有一个输入框和一个日期选择框,用户输入航班号和日期后,点击查询按钮,会发送一个 GET 请求到 "/flightQuery" 地址,并且将用户输入的航班号和日期作为参数一起发送。当请求成功时,会将返回的查询结果显示在页面中间的区域中。
页面最下面有一个退出按钮,当用户点击该按钮时,会跳转至首页。
需要注意的是,该页面中使用了 jQuery 库,所以在使用该页面前需要确保已经引入了 jQuery 库。同时,该页面中的请求地址需要根据实际情况进行修改。
阅读全文