参考链接:http://shenymce.blog.51cto.com/337979/693868
Ajax.html页面
- <!DOCTYPE html>
- <html>
- <head>
- <title></title>
- <meta http-equiv="Content-Type" content="text/html; charset=gb2312">
- <script type="text/javascript">
- var xmlhttp;
- function SubMit()
- {
- //非IE浏览器XMLHttpRequest对象的创建
- if (window.XMLHttpRequest)
- {
- xmlhttp=new XMLHttpRequest();
- }
- //IE浏览器XMLHttpRequest对象的创建
- else if(window.ActiveXObject)
- {
- var activename=["Msxml2.XMLHTTP","Msxml.XMLHTTP","Microsoft.XMLHTTP"];
- for (i=0;activename.length;i++)
- {
- try{
- xmlhttp=new ActiveXObject(activename[i]);
- break;
- }
- catch(e){}
- }
- }
- if (xmlhttp)
- {
- document.getElementById("message").innerHTML="开始用户名测试...";
- window.setTimeout('postxml()',2000); //2秒后执行
- }
- else
- {
- alert("你的浏览器不支持XMLHttpRequest对象");
- }
- }
- function godo()
- {
- //判断服务器是否有返回值
- if(xmlhttp.readyState == 4)
- //判断HTTP请求是否正确
- {
- if(xmlhttp.status == 200)
- {
- //获得服务器返回的数据
- document.getElementById("message").innerHTML=xmlhttp.responseText;
- }
- }
- }
- //采用get方式传递参数
- function getxml()
- {
- var uname=document.getElementById("UserName");
- xmlhttp.open("get","AjaxServlet?uname="+uname.value,true)
- xmlhttp.onreadystatechange=godo;
- xmlhttp.send(null);
- }
- //采用post方式传递参数
- function postxml()
- {
- var uname=document.getElementById("UserName");
- xmlhttp.open("post","AjaxServlet",true)
- xmlhttp.onreadystatechange=godo;
- xmlhttp.setRequestHeader ("Content-Type","application/x-www-form-urlencoded");
- xmlhttp.send("uname="+uname.value);
- }
- </script>
- </head>
- <body>
- <input type="text" id="UserName"/>
- <input type="button" value="用户名验证" onclick="SubMit();"/>
- <div id="message"></div>
- </body>
- </html>
AjaxServlet.java页面
- protected void processRequest(HttpServletRequest request, HttpServletResponse response)
- throws ServletException, IOException {
- response.setContentType("text/html;charset=UTF-8");
- PrintWriter out = response.getWriter();
- try {
- String old=request.getParameter("uname");
- if(old == null || "".equals(old))
- {
- out.println("用户名不可以为空");
- }else{
- String name = new String(old.getBytes("ISO8859-1"),"gb2312");
- System.out.println(name);
- if(name.equals("123"))
- {
- out.println("用户名"+ name + "已经存在!");
- }else{
- out.println("用户名"+ name + "可以注册!");
- }
- }
- } finally {
- out.close();
- }
- }
相关推荐
当Ajax与JSP结合时,可以在客户端使用Ajax进行异步请求,而后端由JSP处理请求并返回数据,两者配合能构建高效且响应快速的Web应用。 **Ajax的工作原理:** 1. 用户触发一个Ajax事件,例如点击按钮。 2. JavaScript...
【Ajax+jsp Demo】是一个典型的应用实例,它结合了异步JavaScript与XML(Ajax)技术和JavaServer Pages(jsp)来创建动态、交互性强的Web应用。这个实例主要展示了如何利用Ajax进行局部页面更新,以及如何在后端使用...
Ajax 技术中 get 与 post 两种请求方式是许多开发者经常遇到的疑问,以下将详细解释两者的区别,并提供实例代码。 一、get 与 post 的基本区别 1. 参数传递方式:get 请求将参数数据队列加到提交表单的 ACTION ...
- **异步请求**:在客户端,使用Ajax发送请求到JSP页面,请求可能携带参数,例如通过`send(data)`传递。 - **服务器端处理**:JSP接收到请求后,执行Java代码,处理业务逻辑,可能涉及数据库查询或其他计算。 - *...
这些函数提供了方便的方式来设置请求参数,如URL、类型(GET或POST)、数据以及回调函数等。 2. **Servlet处理请求**:在服务器端,Servlet是Java Web应用中处理HTTP请求的主要组件。在这个例子中,Servlet接收来自...
在现代Web应用中,用户对交互性和实时性的需求越来越高,其中文件上传功能是常见的操作之一。"Ajax + JSP 实现带进度条的文件上传...通过学习和理解这些代码,你可以更深入地掌握Ajax与JSP结合实现文件上传的完整流程。
- Ajax的基本原理和jQuery库中的Ajax方法,如`$.ajax()`, `$.get()`, `$.post()`等。 - JSP语法,包括EL(Expression Language)和JSTL(JavaServer Pages Standard Tag Library)。 - Hibernate的配置、实体映射、...
在IT行业中,Ajax(异步JavaScript和XML)与JSP(JavaServer Pages)结合使用时,经常用于实现网页的动态无刷新分页功能。这种技术能够提升用户体验,因为用户无需等待整个页面重新加载就能查看新的内容。下面我们将...
这个博客项目提供了从简单的用户交互到服务器数据交换的完整示例,对于初学者来说,可以深入理解 Ajax 和 JSP 如何协同工作,提升 Web 应用的性能和用户体验。通过学习这个源码,你可以熟练掌握动态页面更新、异步...
4. **Ajax通信**:使用Ajax的`XMLHttpRequest`对象或者jQuery的`$.ajax()`函数,向Servlet发送GET或POST请求,获取服务器返回的验证结果或省市数据。如果用户名已存在,Ajax响应可以返回错误信息,前端展示给用户;...
【Ajax与JSP结合构建实时聊天室】 Ajax(Asynchronous JavaScript and XML)是一种在无需刷新整个网页的情况下,能够更新部分网页的技术。它通过在后台与服务器进行少量数据交换,使得网页实现异步更新。这种技术...
本文主要介绍了 jsp+ajax 发送 GET 请求的方法,包含了 Ajax 数据的发送与 JSP 文件的处理技巧。下面是详细的知识点: 一、Ajax 发送 GET 请求 Ajax 发送 GET 请求是通过创建 XMLHttpRequest 对象来实现的。在 ...
项目内容从创建原生态的HTTPXMLRequest实现ajax开始,详细讲解ajax的应用,各种应用场合的实战案例;利用JQuery的ajax支持,详细讲解$.ajax,$.post,$.get等方法实现ajax技术;讲解ajax文件上传,三级联动等;利用...
例如,使用jQuery的`$.ajax()`或`$.get()`、`$.post()`等函数可以方便地发送AJAX请求。同时,JSP可以通过包含Servlet或JavaBeans来处理后端逻辑,这些组件接收并处理AJAX请求,然后返回所需的数据。 接下来,我们将...
2. Ajax发送GET或POST请求到Servlet,携带省份ID。 3. Servlet接收到请求后,使用JDBC连接Oracle数据库,执行SQL查询对应城市的语句,如`SELECT * FROM City WHERE province_id = ?`。 4. 将查询结果转换为JSON格式...
在本项目中,"Ajax+Servlet+Jsp实现页面无刷新查询学生成绩系统",主要涉及了四个关键技术和概念:Ajax、Servlet、JavaScript(JS)以及JavaServer Pages(JSP)。下面将对这些技术及其在项目中的应用进行详细解释。...
在本教程中,我们将深入探讨Ajax与JSP的结合应用,以实现动态无刷新的数据交互。这个系列的第一部分,我们关注的是"zipcode_1st"示例,它演示了如何利用Ajax技术实时查询并更新邮政编码(zipcode)信息,而无需整个...
2. **Ajax请求**:在JavaScript中,使用`$.ajax`或`fetch`方法发送GET或POST请求,携带必要的参数,如当前展开的节点id,到服务器获取子节点数据。 3. **服务器处理**:jsp接收到请求后,根据请求参数查询MySQL...
- **解析请求参数**:Servlet可以通过HttpServletRequest对象的getParameter()方法获取POST或GET请求中的参数。 - **执行业务逻辑**:根据请求参数执行相应的操作,如查询数据库、计算等。 - **设置响应内容**:...
但是,当服务器支持CORS时,我们可以在AJAX请求中设置`withCredentials`为`true`,启用跨域的cookies传递: ```javascript $.ajax({ url: 'http://otherdomain.com/api', type: 'GET', xhrFields: { ...