黑马day18 jquery高级特性&Ajax的load方法
介绍jquery中的load方法：
(1).前面没有jquery.修饰，能够判断出他是一个普通的非全局函数（也就是说是一个局部函数）:$.,$().,jquery.等修饰的就是全局函数。没有这些修饰的就是局部函数。
(2).$(expr).load(url,data,callback);
url：请求路径，绝对路径或者相对路径都能够.
data: 请求參数，格式必须是key/value格式(json格式)
callback:回调函数。function(data,textStatus,XMLHttpRequest) data:代表请求返回内容 textStatus:代表请求状态succuss, error, notmodify, timeout 4 种 XMLHttpRequest：XMLHttpRequest对象
(3).默认情况下在没有向server发送请求数据的时候是load()方法就是GET请求，假设有请求參数那么就是POST请求
(4). load()不能自己定义请求类型,而是由是否向server端发送请求数据. load()不能自己定义数据交换格式,仅仅能使用文本(HTML)格式
案例：
load.html页面
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>load()方法</title>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<script type="text/javascript" src="../js/jquery-1.4.2.js">
</script>
<style type="text/css">
div, span {
width: 140px;
height: 140px;
margin: 20px;
background: #9999CC;
border: #000 1px solid;
float: left;
font-size: 17px;
font-family: Roman;
}
div.mini {
width: 30px;
height: 30px;
background: #CC66FF;
border: #000 1px solid;
font-size: 12px;
font-family: Roman;
}
div.visible {
display: none;
}
</style>
<!--引入jquery的js库-->
</head>
<body>
<form action="" name="form1" id="form1">
<input type="text" name="username" id="username" value="zhang">
<br>
<input type="text" name="psw" id="psw" value="99999">
<br>
<input type="button" id="b1" value="登陆">
</form>
<div id="one">
</div>
</body>
<script language="JavaScript">
$().ready(function(){
var json={username:$("#username").val(),psw:$("#psw").val()};
$("#b1").click(function(){
$("#one").load("load.jsp",json,function(data,textStatus,XMLHttpRequest){
alert(data);
alert(textStatus);
});
});
});
</script>
</html>
load.jsp（相当于一个server,也能够使用Servlet我这里使用的jsp比較方便）<%@ page language="java" pageEncoding="UTF-8"%>
<%
System.out.println("connection server success!");
System.out.println(request.getMethod());//获取请求參数类型
System.out.println("username = "+request.getParameter("username"));//获取请求參数
System.out.println("password = "+request.getParameter("psw"));
out.println("helloworld!");
%>浏览器显示：
控制台显示：
