7.14号学习itcast ajax视频笔记2

vzhchv0010 · 发表于 2013-1-23 02:45:58

1.首先用XMLHttpRequest对象来进行简单的验证例子,在这例子里分get和post两种方式分别写例子,还有纯文本和xml两种返回
用户信息格式
post方法返回纯文本
准备工作: 开发工具IntelliJ 7.0 集成工具,jquery.js,
1.post.html
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"><html><head> <title>hehe</title> <script type="text/javascript" src="jslib/zhc2.js"></script></head><body> ========<br /> <input id="name" type="text" /> <input type="button" value="校验" /> <div id="result" ></div></body></html>
2.zhc2.js
var xmlhttp;function verifyown() { var username; username = document.getElementById("name").value; if (window.XMLHttpRequest) { xmlhttp = new XMLHttpRequest(); //针对特定浏览器进行bug修正 if (xmlhttp.overrideMimeType) { xmlhttp.overrideMimeType("text/xml"); } } else if (window.ActiveXObject) { var activName = ["MSXML2.XMLHTTP","Microsoft.XMLHTTP"]; for (var i = 0; i < activName.length; i++) { try { xmlhttp = new ActiveXObject(activeName[i]); break; } catch(e) { } } } xmlhttp.onreadystatechange = callback; //3. open参数 // http方法，例如：POST、GET、PUT及PROPFIND。大小写不敏感。 //请求的URL地址，可以为绝对地址也可以为相对地址 //布尔型，指定此请求是否为异步方式，默认为true。如果为真，当状态改变时会调用onreadystatechange属性指定的回调函数。 //第三个参数理解:如果为异步,则程序运行到这还会继续向下进行,如果是同步的,必须在send()方法处等服务器把数据返回来后才会向后运行. //如果服务器需要验证，此处指定用户名，如果未指定，当服务器需要验证时，会弹出验证窗口 //验证信息中的密码部分，如果用户名为空，则此值将被忽略。 // xmlhttp.open("GET","zhc?name="+username,true); //对于post方法来说: //post :第二个参数只写url地址,不写跟着的信息 xmlhttp.open("POST","zhc",true); // 自己设置http请求头,application/x-www-form-urlencoded可以满足大部分需要 xmlhttp.setRequestHeader("Content-Type","application/x-www-form-urlencoded") ; //post方式发送数据 ,发给服务器的信息需要在这里面设置 xmlhttp.send("name="+username); //到此,post和get没有别的区别了.}function callback(){ //onreadystatechange为了保证数据回来之后能够找到方法来执行,共5个状态 //每个状态的变化都会运行callback()的方法 //0 (未初始化) 对象已建立，但是尚未初始化（尚未调用open方法） //1 (初始化) 对象已建立，尚未调用send方法 //2 (发送数据) send方法已调用，但是当前的状态及http头未知 //3 (数据传送中) 已接收部分数据，因为响应及http头不全，这时通过responseBody和responseText获取部分数据会出现错误， //4 (完成) 数据接收完毕,此时可以通过通过responseBody和responseText获取完整的回应数据 //判断服务器返回状态,看对象是否交互完成 if(xmlhttp.readyState== 4) { if(xmlhttp.status == 200){ //获取服务器返回对象 //杜宇httprequest对象返回对象的形式两种,一种是纯文本,一种是xml方式 var fanhuizhi = xmlhttp.responseText; //用dom方式返回,先得到节点 var divNode = document.getElementById("result"); //把该节点的值设置为刚得到的值 divNode.innerHTML = fanhuizhi ; } } //个人认为:fierbug只能调试语法之类的错误,如果你是因为对象名字,大小写等写错则不会提示error.只能一个一个区查对象}

其实get和post不同主要是在向服务器传送的时候有差别,体现在open()方法和send()方法中.其它地方都一样

		自动登录	找回密码
密码			立即注册

7.14号学习itcast ajax视频 笔记2

7.14号学习itcast ajax视频笔记2