<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>欢迎登录后台管理系统</title>
<link href="css/style.css" rel="stylesheet" type="text/css" />
<script language="JavaScript" src="js/jquery.js"></script>
<script src="js/cloud.js" type="text/javascript"></script>
<script language="javascript">
$(function(){
$('.loginbox').css({'position':'absolute','left':($(window).width()-692)/2});
$(window).resize(function(){
$('.loginbox').css({'position':'absolute','left':($(window).width()-692)/2});
})
});
</script>
</head>
<body style="background-color:#1c77ac; background-image:url(images/light.png); background-repeat:no-repeat; background-position:center top; overflow:hidden;">
<div id="mainBody">
<div id="cloud1" class="cloud"></div>
<div id="cloud2" class="cloud"></div>
</div>
<div class="logintop">
<span>欢迎登录后台管理界面平台</span>
<ul>
<li><a href="#">回首页</a></li>
<li><a href="#">帮助</a></li>
<li><a href="#">关于</a></li>
</ul>
</div>
<div class="loginbody">
<span class="systemlogo"></span>
<div class="loginbox">
<ul>
<li><input name="" type="text" class="loginuser" id="inputLoginCode" value="admin" onclick="JavaScript:this.value=''"/></li>
<li><input name="" type="text" class="loginpwd" id="inputPassword" value="密码" onclick="JavaScript:this.value=''"/></li>
<li><input name="" type="button" class="loginbtn" id="login" value="登录" />
<label><input name="" type="checkbox" value="" checked="checked" />记住密码</label>
<label><a href="#">忘记密码?</a></label></li>
</ul>
</div>
</div>
<div class="loginbm">版权所有 2014 <a href="http://www.uimaker.com">uimaker.com</a> 仅供学习交流,勿用于任何商业用途</div>
<script type="text/javascript" src="js/login.js"></script>
</body>
</html>
/**
*
*/
$(function() {
$("#login").click(function() {
var loginname = $("#inputLoginCode").val();
var userpws = $("#inputPassword").val();
var postData = {
"loginName" : loginname,
"userPws" : userpws
}
// alert("用户:"+postData.loginName);
$.ajax({
url : 'singin',
type : 'get',
data : postData,
dataType : "json",
success : function(data) {
alert("true----" + data);
},
error : function(xhr, status, error) {
alert("error---" + xhr.readyState);
// 0 - (未初始化)还没有调用send()方法
// 1 - (载入)已调用send()方法,正在发送请求
// 2 - (载入完成)send()方法执行完成,已经接收到全部响应内容
// 3 - (交互)正在解析响应内容
// 4 - (完成)响应内容解析完成,可以在客户端调用了
}
});
});
});
出现任何错误都会跳到error函数里
举例说明一些错误原因:
dataType错误
类型错误:后台返回的dataType类型和前台写的不一致会跳入error
格式错误:jquery1.4之后对json的格式要求非常严格,json格式错误也会跳入error.{“test”:1} 注意格式
有时,在不需要返回值的情况下,扔按模板格式,设置了dataType:”json”,参数;这时候,ajax传值正确时,出现200返回成功状态下报错的特殊情况。
async请求同步异步问题
async默认是true(异步请求),如果想一个Ajax执行完后再执行另一个Ajax, 需要把async=false
例如,你用post请求传值到另一个页面后台,但是页面一加载你的ajax就已经执行过了,传值接收是在后台才完成的,这时候就请求不到数据,所以可以考虑把ajax请求改为同步试试。
data不能不写
data为空也一定要传”{}”;不然返回的是xml格式的。并提示parsererror. data:”{}”
parsererror的异常和Header 类型也有关系。及编码header(‘Content-type: text/html; charset=utf8’);
传递的参数
必须是ajax支持的编码格式
URL路径问题
路径不能有中文
用error调试错误信息:
可以alert出来,查看具体是哪里出错了
具体参数:
XMLHttpRequest:XMLHttpRequest.readyState: 状态码的意思
0 - (未初始化)还没有调用send()方法
1 - (载入)已调用send()方法,正在发送请求
2 - (载入完成)send()方法执行完成,已经接收到全部响应内容
3 - (交互)正在解析响应内容
4 - (完成)响应内容解析完成,可以在客户端调用了
XMLHttpRequest:XMLHttpRequest.status:
textStatus:错误原因
null timeout error notmodified parsererror
errorThrown:(可选)捕获的错误对象
package com.zhjy.controller;
import javax.servlet.http.HttpServletRequest;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RequestMethod;
import org.springframework.web.bind.annotation.ResponseBody;
import com.alibaba.fastjson.JSON;
import com.zhjy.dao.User;
import com.zhjy.service.IUserService;
import com.zhjy.vo.LoginVo;
@Controller
public class UserController {
@Autowired
private IUserService userService;
@RequestMapping(value = "/singin", method = { RequestMethod.GET })
@ResponseBody
public String singIn(LoginVo msg, HttpServletRequest request) {
System.out.println("----------------------" + msg.toString());
User user = userService.getUserById(1);
System.out.println(JSON.toJSON(user));
return JSON.toJSON(user).toString();
}
}
package com.zhjy.vo;
public class LoginVo {
String loginName;
String userPws;
public String getLoginName() {
return loginName;
}
public void setLoginName(String loginName) {
this.loginName = loginName;
}
public String getUserPws() {
return userPws;
}
public void setUserPws(String userPws) {
this.userPws = userPws;
}
@Override
public String toString() {
return "LoginVo [loginName=" + loginName + ", userPws=" + userPws + "]";
}
}
<?xml version="1.0" encoding="UTF-8"?>
<web-app xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xmlns="http://java.sun.com/xml/ns/javaee"
xsi:schemaLocation="http://java.sun.com/xml/ns/javaee http://java.sun.com/xml/ns/javaee/web-app_3_0.xsd"
id="schedule-console" version="3.0">
<display-name>Archetype Created Web Application</display-name>
<!-- Spring和mybatis的配置文件 -->
<context-param>
<param-name>contextConfigLocation</param-name>
<param-value>classpath:spring-mybatis.xml</param-value>
</context-param>
<!-- 编码过滤器 -->
<filter>
<filter-name>encodingFilter</filter-name>
<filter-class>org.springframework.web.filter.CharacterEncodingFilter</filter-class>
<async-supported>true</async-supported>
<init-param>
<param-name>encoding</param-name>
<param-value>UTF-8</param-value>
</init-param>
</filter>
<filter-mapping>
<filter-name>encodingFilter</filter-name>
<url-pattern>/*</url-pattern>
</filter-mapping>
<!-- Spring监听器 -->
<listener>
<listener-class>org.springframework.web.context.ContextLoaderListener</listener-class>
</listener>
<!-- 防止Spring内存溢出监听器 -->
<listener>
<listener-class>org.springframework.web.util.IntrospectorCleanupListener</listener-class>
</listener>
<!-- Spring MVC servlet -->
<servlet>
<servlet-name>SpringMVC</servlet-name>
<servlet-class>org.springframework.web.servlet.DispatcherServlet</servlet-class>
<init-param>
<param-name>contextConfigLocation</param-name>
<param-value>classpath:spring-mvc.xml</param-value>
</init-param>
<load-on-startup>1</load-on-startup>
<async-supported>true</async-supported>
</servlet>
<servlet-mapping>
<servlet-name>SpringMVC</servlet-name>
<!-- 此处可以可以配置成*.do,对应struts的后缀习惯 -->
<url-pattern>/</url-pattern>
</servlet-mapping>
<!-- tomcat默认路径 -->
<welcome-file-list>
<welcome-file>/login1.html</welcome-file>
</welcome-file-list>
<!-- Servlet Mapping -->
<servlet-mapping>
<servlet-name>default</servlet-name>
<url-pattern>*.html</url-pattern>
</servlet-mapping>
<servlet-mapping>
<servlet-name>default</servlet-name>
<url-pattern>*.js</url-pattern>
</servlet-mapping>
<servlet-mapping>
<servlet-name>default</servlet-name>
<url-pattern>*.css</url-pattern>
</servlet-mapping>
<servlet-mapping>
<servlet-name>default</servlet-name>
<url-pattern>*.png</url-pattern>
</servlet-mapping>
<servlet-mapping>
<servlet-name>default</servlet-name>
<url-pattern>*.jpg</url-pattern>
</servlet-mapping>
<servlet-mapping>
<servlet-name>default</servlet-name>
<url-pattern>*.gif</url-pattern>
</servlet-mapping>
</web-app>