SpringMVC+Maven框架(4)ajax请求

最新推荐文章于 2021-11-13 21:09:27 发布

魑魅魍魉9527

最新推荐文章于 2021-11-13 21:09:27 发布

阅读量640

点赞数

分类专栏： html java 文章标签： ajax spring mvc

本文链接：https://blog.csdn.net/qq_28934205/article/details/79064332

版权

java 同时被 2 个专栏收录

19 篇文章 0 订阅

订阅专栏

html

5 篇文章 0 订阅

订阅专栏

这里写图片描述

<!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>

魑魅魍魉9527

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
打赏
0
评论
SpringMVC+Maven框架(4)ajax请求

<!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-Ty
复制链接

扫一扫