ajax相关知识点

最新推荐文章于 2024-07-23 09:02:31 发布

xiaojx_

最新推荐文章于 2024-07-23 09:02:31 发布

阅读量188

点赞数

分类专栏： Java 文章标签： Java

本文链接：https://blog.csdn.net/xiaojx_/article/details/101399985

版权

Java 专栏收录该内容

21 篇文章 2 订阅

订阅专栏

什么是ajax呢？

ajax是一种用于创建快速动态网页的技术
全称为：Asynchronous Javascript And XML 异步JavaScript或XML
可以在不加载整个网页的情况下，对网页的部分内容进行更新

ajax开发步骤
1.创建xmlHttpRequest对象（ajax引擎）
2.设定ajax引擎相关参数：
open
onreadystatechange
send

光看这些可能有点懵，那我们来写个例子快速上手

首先

jsp页面内容

<script type="text/javascript">
function validateName(){
	//创建对象
	var xmlhttp;
	if(window.XMLHttpRequest){
		
		//  IE7+, Firefox, Chrome, Opera, Safari 浏览器执行代码
		xmlhttp=new XMLHttpRequest();
		
	}else{
		
	    // IE6, IE5 浏览器执行代码
	    xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
	    
	}
	
	//获得页面中的username
	var username = document.getElementById("username").value;
	
	//将请求发送到服务器
	xmlhttp.open("GET","ValidateNameServlet?username="+username,true);
	
	//响应   定义请求状态改变时调用函数，获取相应数据后，将响应结果放到页面
	xmlhttp.onreadystatechange=function(){
		//如果请求成功
		if(xmlhttp.readyState==4&xmlhttp.status==200){
			//把响应结果放进页面
			document.getElementById("result").innerHTML=xmlhttp.responseText;
		}
	}
	xmlhttp.send();
}
</script>

username:<input type="text" name="username" id="username" onblur="validateName()"/>
<p id="result"></p>

然后，我们需要有一个Servlet

在Servlet中写下面的内容

@Override
protected void service(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
	//获取username
	String username = request.getParameter("username");
	
	//如果username不是空 或者 等于xiaoming 在页面输出Ok 在页面否则输出No
	if(username!=null&&"xiaoming".equals(username)) {
		response.setContentType("text/plain;charset=utf-8");
		response.getWriter().println("Ok");
	}else {
		response.setContentType("text/plain;charset=utf-8");
		response.getWriter().println("No");
	}
}