您的位置：首页 > Web前端 > JQuery

JQuery基础_Ajax

2017-07-16 23:31 260 查看
Ajax：

AJAX 是一种在无需重新加载整个网页的情况下，能够更新部分网页的技术。

通过在后台与服务器进行少量数据交换，AJAX 可以使网页实现异步更新。这意味着可以在不重新加载整个网页的情况下，对网页的某部分进行更新。

局部刷新好处：

只更新部分页面，有效利用带宽，减轻服务器负担。

提供类似C/S（即客户/服务器-应用程序）的交互效果，操作方便，连续性强。

使用异步方式和服务器通信，无需打断用户操作。

这里我们只介绍jquery中封装好的方法

1、**$.post(url,[data],[fn],[type])**

通过远程TTP GET请求载入信息

这是一个简单的 GET 请求功能以取代复杂 $.ajax 。请求成功时可调用回调函数。

如果需要在出错时执行函数，请使用 $.ajax。

参数：

url:待载入页面的URL地址

data:待发送 Key/value 参数。

callback:载入成功时回调函数。

type:返回内容格式，xml, html, script, json, text, _default。

例子：

//body里面的代码
<body>
<center>
用户名：<input type="text" name="username" id="username"/></br>
密 码:<input type="text" name="password" id="password"/></br>
<button onclick="checkUser()">查询</button>
</center>
</body>


function checkUser()
{

var username=$("#username").val();
var password=$("#password").val();
//得到表单中填写的用户名和密码
$.post("UserServlet",{username:username,password:password},function(data){
//这里用post方式请求，第一个参数请求地址是UserServlet，第二个参数发送两个对象 一个用户名 一个密码， Key/value形式保存数据。第三个参数是回调函数，里面可以给参数，data返回的是后台向页面传过来的数据
if(data=="1"){
//data是UserServlet返回的
alert("不存在");
}else{
alert("存在");
}
});
}


//UserServlet类：

public void doPost(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException {

response.setContentType("text/html");
PrintWriter out = response.getWriter();
String username=request.getParameter("username");
String password=request.getParameter("password");
//得到请求过来的用户名和密码
System.out.println(username);
System.out.println(password);
User user= UserDao.getInstance().getAllUser(username,password);
//调用UserDao里面的查询方法向数据库中查询用户名和密码是否存在。
if(user==null){
//如果不存在,返回1，这里的"1"就是$.post请求中毁掉函数里面的data
out.print("1");
}else{
//如果不存在返回"0"
out.print("0");
}

}


页面：



这样就在不重新加载页面的情况下完成了异步请求。

2、**$.get(url,[data],[fn],[type])**

get方法和post是一样的用法，只是请求方式不同。


后面再介绍复杂一点的 $.ajax(url,[settings]) 方法。

参考地址:JQuery_Ajax
内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理 点击这里给我发消息
标签：  jquery ajax 异步
相关文章推荐
新的分享
章节导航