ajax 请求数据的两种方法

前端之家收集整理的这篇文章主要介绍了ajax 请求数据的两种方法前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。

实现ajax 异步访问网络的方法有两个。第一个是原始的方法,第二个是利用jquery包的

原始的方法不用引入jquery包,只需在html中编写script 片段

这里我演示的是一个传递参数查询的例子;

varurl="expert_ZFTservlet?expert_name="+"曾攀";

一.原始的方法

<script type="text/javascript">

function load(){

var xmlhttp;

if (window.XMLHttpRequest){// code for IE7+,Firefox,Chrome,Opera,Safari

xmlhttp= newXMLHttpRequest();

}else{// code for IE6,IE5

xmlhttp= newActiveXObject("Microsoft.XMLHTTP");

}

xmlhttp.onreadystatechange= function(){

if (xmlhttp.readyState ==4 && xmlhttp.status == 200) {//获得了请求数据

var expertinfolist = xmlhttp.responseText;

//发送请求数据到myDiv document.getElementById("myDiv").innerHTML=expertinfolist;

}

}

var url="expert_ZFTservlet?expert_name="+"曾攀";

xmlhttp.open("GET",url,true);

xmlhttp.send();

}

</script>

</@H_403_200@head>

<@H_403_200@body>

<@H_403_200@div id="myDiv">

</@H_403_200@div>

<@H_403_200@button type="button" onclick="load()" >ChangeContent</@H_403_200@button>

</@H_403_200@body>

二.利用jquery包的ajax请求

在使用该方法前需要引入Jquery包

<@H_403_200@script src="js/jquery-1.5.1.min.js" type="text/javascript"></@H_403_200@script>

<@H_403_200@script>

$.ajax({

type:'post',//方法类型

url:" expert_ZFTservlet?expert_name="+"曾攀",//请求地址

dataType:'json',//数据类型

success:callback//请求成功处理函数

});

//返回函数

function callback(data){

alert(data); //获得请求返回对象;

}

</@H_403_200@script>

这个是我请求的servlet 的一些代码

expertinfolist为我的查询结果,

为一个list<Object>类型的对象

request.setCharacterEncoding("utf-8");

response.setCharacterEncoding("utf-8");

PrintWriterout=response.getWriter();

out.print(expertinfolist);

out.flush();

out.close();

猜你在找的Ajax相关文章