JQuery中$.ajax()分享
HTTP 请求加载远程数据。通过jQuery 底层 AJAX 实现。简单易用的高层实现见 $.get, $.post 等。$.ajax() 返回其创建的 XMLHttpRequest对象。大多数情况下你无需直接操作该对象，但特殊情况下可用于手动终止请求。$.ajax() 只有一个参数：参数 key/value 对象，包含各配置及回调函数信息。详细参数选项见下。注意： 如果你指定了 dataType 选项，请确保服务器返回正确的 MIME 信息，(如 xml 返回 "text/xml")。错误的 MIME 类型可能导致不可预知的错误。注意：如果dataType设置为"script"，那么在远程请求时(不在同一个域下)，所有POST请求都将转为GET请求。(因为将使用DOM的script标签来加载)jQuery 1.2 中，您可以跨域加载 JSON 数据，使用时需将数据类型设置为 JSONP。使用 JSONP 形式调用函数时，如 "myurl?callback=?" jQuery 将自动替换 ? 为正确的函数名，以执行回调函数。数据类型设置为 "jsonp"时，jQuery 将自动调用回调函数。
ajax工作原理
XMLHttpRequest对象方法详解
1、具体运用如下，比如要严重用户名是否重复用户名输入框加onblur="validate(this) this是为了获取光标离开后的数据 <div name="userIdSpan"></div>是为了有没有重复代码写文字提醒
<input name="userId" type="text" data-rules="{required:true}" class="input-normal control-text" onblur="validate(this)"><div name="userIdSpan"></div>
2、JavaScript添加
<SCRIPT language=JavaScript>
//创建浏览器对象
var xmlHttp;
function createXMLHttpRequest() {
//表示当前浏览器不是ie,如ns,firefox
if(window.XMLHttpRequest) {
xmlHttp = new XMLHttpRequest();
} else if (window.ActiveXObject) {
xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
}
}
function validate(field) {
if ($.trim(field.value).length != 0) {
//创建XMLHttpRequest
createXMLHttpRequest();
var url = "user_validate.jsp?userId=" + $.trim(field.value) + "×tamp=" + new Date().getTime();
xmlHttp.open("GET", url, true);
//方法地址，处理完成后自动调用，回调
xmlHttp.onreadystatechange=function() { //匿名函数
if(xmlHttp.readyState == 4) { //Ajax引擎初始化成功
if (xmlHttp.status == 200) { //http协议成功
document.getElementsByName("userIdSpan")[0].innerHTML = "<font color='red'>" + xmlHttp.responseText + "</font>";
}else {
alert("请求失败，错误码=" + xmlHttp.status);
}
}
};
//将参数发送到Ajax引擎
xmlHttp.send(null);
}else {
document.getElementsByName("userIdSpan")[0].innerHTML = "";
}
}
function addUser() {
with(document.getElementById("J_Form")) {
method="post";
action="Add_user.jsp?command=add";
submit();
}
}
</SCRIPT>
3、添加user_validate.jsp页面如下：
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<%@ page import="com.marcellotest.sysmgr.dormain.*" %>
<%
//可以采用清除缓存的方法，如下
//response.setContentType("text/xml");
//response.setHeader("Cache-Control", "no-store"); //HTTP1.1
//response.setHeader("Pragma", "no-cache"); //HTTP1.0
//response.setDateHeader("Expires", 0);
//out.println("Hello");
//Thread.currentThread().sleep(3000);
String userId = request.getParameter("userId");
if (UserManager.getInstance().findUserById(userId) != null) {
out.println("用户代码已经存在");
}
%>
UserManager.getInstance().findUserById(userId)
这个代码是验证是否有这个用户名的，那么就要在后台xie这个函数
4、后台代码如下
import java.sql.Connection;
import java.sql.PreparedStatement;
import java.sql.ResultSet;
import java.sql.SQLException;
import java.sql.Statement;
import java.sql.Timestamp;
import java.util.ArrayList;
import java.util.List;
/**
* 用户管理类
* @author Administrator
*
*/
public class UserManager {
private static UserManager instance = null;
private UserManager() {}
public static synchronized UserManager getInstance() {
if (instance == null) {
instance = new UserManager();
}
return instance;
}
/**
* 根据用户id查询
* @param userId
* @return 如果存在返回User对象，否则返回null
*/
public User findUserById(String userId) {
System.out.println("UserManager.findUserById() -->> userId=" + userId);
String sql = "select * from t_user where user_id=?";
Connection conn = null;
PreparedStatement pstmt = null;
ResultSet rs = null;
User user = null;
try {
conn = DBUtil.getConnection();
pstmt = conn.prepareStatement(sql);
pstmt.setString(1, userId);
rs = pstmt.executeQuery();
//存在用户信息
if (rs.next()) {
user = new User();
user.setUserId(rs.getString("user_id"));
user.setUserName(rs.getString("user_name"));
user.setPassword(rs.getString("password"));
user.setContactTel(rs.getString("contact_tel"));
user.setEmail(rs.getString("email"));
user.setCreateDate(rs.getTimestamp("create_date"));
}
}catch(SQLException e) {
e.printStackTrace();
}finally {
DBUtil.close(rs);
DBUtil.close(pstmt);
DBUtil.close(conn);
}
return user;
}
}
当然 用户资料和数据库得调用自己写的；
今天太困了，我就先睡觉了；各位再见！
