加入收藏 | 设为首页 | 会员中心 | 我要投稿 李大同 (https://www.lidatong.com.cn/)- 科技、建站、经验、云计算、5G、大数据,站长网!
当前位置: 首页 > 百科 > 正文

ajax 初识 w3cschool

发布时间:2020-12-16 00:22:42 所属栏目:百科 来源:网络整理
导读:处理数据的三种方式 text : xmlhttp.responseText xml : xmlhttp.responseXML json : javascript的原生对象,通过eval函数转换,eval("("+xmlhttp.responseText+")") ajax.html form method="get" input type="text" name="name" id="name" onchange="checkU

处理数据的三种方式

text :

xmlhttp.responseText

xml: xmlhttp.responseXML

json: javascript的原生对象,通过eval函数转换,eval("("+xmlhttp.responseText+")")


ajax.html

		 <form method="get">
			 <input type="text" name="name" id="name" onchange="checkUserAjax();"/> <br/>
			 <div id="msg"></div>
			 <input type="text" name="age" id="age" /><br />
		 </form>


check.jsp

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<% 
	String name = request.getParameter("name");
	System.out.println("xxx  " + name);

	String msg = "success";
	if("admin".equals(name)){
		msg = "fail";
	}
	out.print(msg);
%>


ajax.js

function $(id){
	return document.getElementById(id);
}

function createXHR(){
	var xmlhttp = null;
	if (window.XMLHttpRequest){
		// code for IE7+,Firefox,Chrome,Opera,Safari
		xmlhttp=new XMLHttpRequest();
	}else{
		// code for IE6,IE5
		xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
	}
	return xmlhttp;
}


function checkUserAjax(){
	// 1 
	var name = $("name").value;
	var xmlhttp = createXHR();
	
	//2 
	
	xmlhttp.onreadystatechange = function(){
		if (xmlhttp.readyState==4 && xmlhttp.status==200){
			var str = xmlhttp.responseText;
			$("msg").innerHTML = str;
			//$("statuMsg").innerHTML=xmlhttp.responseText;
			if(str=="fail"){
				$("name").focus();
			}
			
	    }
	}
	
	xmlhttp.open("GET","check.jsp?name="+name,true);
	xmlhttp.send();
	
	//alert(xmlhttp.responseText);
}

(编辑:李大同)

【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容!

    推荐文章
      热点阅读