首页ajax.html网页上有一个文本框，当该文本框失去焦点时，在网页上显示“Ajax请求从服务器响应内容”（该内容应由ajaxServer.jsp提供）

ajax.html网页上有一个文本框，当该文本框失去焦点时，在网页上显示“Ajax请求从服务器响应内容”（该内容应由ajaxServer.jsp提供）

时间: 2024-03-18 07:41:22 浏览: 151

好的，这里是一个简单的实现方案。首先，你需要在ajax.html文件中创建一个文本框和一个用于显示响应内容的div元素。当文本框失去焦点时，通过Ajax请求从服务器获取响应内容，并将其显示在div元素中。 ```html <!DOCTYPE html> <html> <head> <title>Ajax Demo</title> <script src="https://cdn.bootcss.com/jquery/3.5.1/jquery.min.js"></script> </head> <body> <input type="text" id="input"> <div id="response"></div> <script> $(function() { $("#input").blur(function() { $.ajax({ url: "ajaxServer.jsp", type: "GET", success: function(response) { $("#response").text(response); } }); }); }); </script> </body> </html> ``` 在这个示例中，我们使用了jQuery来简化Ajax请求的代码。当文本框失去焦点时，我们发送一个GET请求到ajaxServer.jsp，然后在成功回调函数中将响应内容显示在div元素中。接下来，你需要创建一个名为ajaxServer.jsp的JSP页面，用于处理Ajax请求并返回响应内容。在这个示例中，我们只返回了一个简单的字符串“Ajax请求从服务器响应内容”。 ```jsp <%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%> <% out.print("Ajax请求从服务器响应内容"); %> ``` 这个JSP页面非常简单，只需要输出一个字符串即可。最后，你需要将这两个文件放在一个Web应用程序中，并在Web服务器上运行该应用程序。当你在浏览器中打开ajax.html文件并在文本框中输入一些内容，然后将焦点移开，你将看到一个显示“Ajax请求从服务器响应内容”的div元素。

阅读全文