Ajax的两种实现方式
发布时间：2020-12-16 01:55:14 所属栏目：百科 来源：网络整理
导读：//ajax的jquery实现 function aclick(){ //alert("测试一"); var name = $("#userName").val(); //alert(name); $.get("servlet/AjaxServlet?name=" + name,null,back); } function back(data){ //alert(data); $("#message").html(data); } //ajax的普通实现
|
//ajax的jquery实现 function aclick(){ //alert("测试一"); var name = $("#userName").val(); //alert(name); $.get("servlet/AjaxServlet?name=" + name,null,back); } function back(data){ //alert(data); $("#message").html(data); } //ajax的普通实现 var xmlHttpRequest = null; //javascript的浏览器内置对象，XMLHttpRequest对象是当今所有AJAX和Web 2.0应用程序的技术基础 function ajaxRequest(){ //alert("测试二"); if(window.ActiveXObject) //IE浏览器,判断浏览器是否支持ActiveX控件 { xmlHttpRequest = new ActiveXObject("Microsoft.XMLHTTP"); //创建XMLHttpRequest对象 }else if(window.XMLHttpRequest) //除IE以外的其他浏览器 { xmlHttpRequest = new XMLHttpRequest(); } if(null != xmlHttpRequest) { var v1 = document.getElementById("userName").value; var v2 = document.getElementById("userName").value; //准备向服务器发出一个请求 //get方式发出一个请求 xmlHttpRequest.open("GET","servlet/AjaxServlet?name=" + v1,true); //post方式向服务器发出一个请求 //xmlHttpRequest.open("POST","AjaxServlet",true); //发生转台变换的时候调用回调函数 xmlHttpRequest.onreadystatechange = ajaxCallBack; //使用post提交的时候 必须叫上如下代码 //xmlHttpRequest.setRequestHeader("Content-Type","application/x-www-form-urlencoded"); //向服务器发出一个请求 xmlHttpRequest.send("name="+v1+"&v2=" +v2); } } function ajaxCallBack(){ if(xmlHttpRequest.readyState==4){ //ReadyState取值 描述 //0 描述一种"未初始化"状态；此时，已经创建一个XMLHttpRequest对象，但是还没有初始化。 //1 描述一种"发送"状态；此时，代码已经调用了XMLHttpRequest open()方法并且XMLHttpRequest已经准备好把一个请求发送到服务器。 //2 描述一种"发送"状态；此时，已经通过send()方法把一个请求发送到服务器端，但是还没有收到一个响应。 //3 描述一种"正在接收"状态；此时，已经接收到HTTP响应头部信息，但是消息体部分还没有完全接收结束。 //4 描述一种"已加载"状态；此时，响应已经被完全接收。 if(xmlHttpRequest.status==200){ var content = xmlHttpRequest.responseText; document.getElementById("message").innerHTML = content; } } } （编辑：李大同） 【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容! |