• 全部
  • Java SE
  • Java EE
  • J2ME
  • IDE工具
  • 求助
  • 内推招聘
  • 问答

SSM项目ajax跳转页面 使用 $("#id").html(result)填充jsp页面无效问题

连滚带爬的菜鸟 2021-09-13 16:17:46

自己练习的SSM,在登录页面点击登录时,后台能正常收到数据,但后台返回数据后,ajax在处理完数据进行跳转 window.location.href=xxx时出现404报错,请大神帮忙看看是哪个环节出现问题了,感谢感谢!

源码如下:

1 项目结构:IDEA使用maven创建的SSM框架项目

2 web.xml配置如下:

<?xml version="1.0" encoding="UTF-8"?>
<web-app version="3.0" xmlns="http://java.sun.com/xml/ns/javaee"
         xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
         xsi:schemaLocation="http://java.sun.com/xml/ns/javaee
	http://java.sun.com/xml/ns/javaee/web-app_3_0.xsd">
  <display-name>Archetype Created Web Application</display-name>
  <servlet>
    <servlet-name>ssm-crud</servlet-name>
    <servlet-class>org.springframework.web.servlet.DispatcherServlet</servlet-class>
    <init-param>
      <param-name>contextConfigLocation</param-name>
      <param-value>classpath:applicationContext.xml</param-value>
    </init-param>
    <load-on-startup>1</load-on-startup>
  </servlet>
  <servlet-mapping>
    <servlet-name>ssm-crud</servlet-name>
    <url-pattern>/</url-pattern>
  </servlet-mapping>

  <!--加载log4j-->
<!--  <context-param>
    <param-name>log4jConfigLocation</param-name>
    <param-value>classpath:log4j.properties</param-value>
  </context-param>
  <listener>
    <listener-class>org.springframework.web.context.ContextLoaderListener</listener-class>
  </listener>-->

  <filter>
    <filter-name>encodingFilter</filter-name>
    <filter-class>org.springframework.web.filter.CharacterEncodingFilter</filter-class>
    <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>


  <!--欢迎页文件-->
  <welcome-file-list>
    <welcome-file>/WEB-INF/views/login.jsp</welcome-file>
  </welcome-file-list>
  
</web-app>

3 login.jsp:

<body>
    <div id="login">
        <h1>login</h1>
        <input type="text" id="username" name="username" placeholder="用户名"><br>
        <input type="password" id="password" name="password" placeholder="密码"><br>
        <div id="but">
            <button type="button" id="login_id">登录</button><br>
            <button type="button" id="sign_id">注册</button>
        </div>
    </div>

</body>

4 login.js: Controller层正常返回,登录用户名和密码都正常拿到,但在ajax校验完后通过 window.location.href 这里跳转时始终报错404

$(function (){
     $("#login_id").click(
         function (){
             //获取登录信息
             var name = $("#username").val();
             var pwd = $("#password").val();

             console.log("name:"+name);
             console.log("pwd:"+pwd);

             $.ajax({
                     url:"http://localhost:8888/ssmcrud/login",
                     type: "POST",
                     data: {"username":name,"password":pwd},
                     dataType: "JSON",
                     success: function (result) {
                         console.log("1--------------")
                         if (result.status === 0){
                             $("#error_msg").html(result.msg);
                             window.location.href = "WEB-INF/views/error.jsp";
                         }else{
                             console.log("成功信息:"+result.msg);
                             window.location.href = "WEB-INF/views/hello.jsp";
                         }
                     }
                 }

             )
         }
     );
    }
);

5 Controller层:

===================================================================================================

PS:ajax中获取到后台数据后,需要将其中一项数据设置到 对应 jsp页面的<span>标签中展示出来,但 发现使用 $.("id").html(data) 这个方法并没有生效,jsp页面对应的标签中还是没有内容,是否是这个方法对jsp不生效还是jsp中命名空间没有正确导入?

js和jsp源码如下:

login.js

$(function (){
     $("#login_id").click(
         function (){
             //获取登录信息
             var name = $("#username").val();
             var pwd = $("#password").val();

             console.log("name:"+name);
             console.log("pwd:"+pwd);

             $.ajax({
                     url:"http://localhost:8888/ssmcrud/login",
                     type: "POST",
                     data: {"username":name,"password":pwd},
                     dataType: "JSON",
                     success: function (contents) {
                         console.log(contents);
                         if (contents.status === 0){
                             $("#error_msg").html(contents.msg);
                             window.location.href = "../views/error.jsp";
                         }else{
                             console.log("成功信息:"+contents.msg);
                             $("#result_id").html(contents.msg);
                             window.location.href = "../views/hello.jsp";
                         }
                     }
                 }

             )
         }
     );
    }
);

login.jsp:

<%@ page contentType="text/html;charset=UTF-8" language="java" pageEncoding="utf-8" %>
<%@ page isELIgnored="false"%>
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <title>hello</title>
    <!--引用路径获取setAttribute-->
    <%
        pageContext.setAttribute("APP_PATH",request.getContextPath());
    %>
    <!-- 提前引入jquery -->
    <script type="text/javascript" src="${APP_PATH}/js/jquery-1.11.1.js"></script>
    <!-- 引入样式 -->
    <link href="${APP_PATH}/bootstrap-3.3.7-dist/css/bootstrap.min.css" rel="stylesheet">
    <script src="${APP_PATH}/bootstrap-3.3.7-dist/js/bootstrap.min.js"></script>
</head>
<body>
    <h1>欢迎登录!</h1>
    <span id="result_id"></span>
</body>
</html>

 

 

 

...全文
79 点赞 收藏 5
写回复
5 条回复
切换为时间正序
请发表友善的回复…
发表回复

ajax中获取到后台数据后,需要将其中一项数据设置到 对应 jsp页面的标签中展示出来,但 发现使用 $.("id").html(data) 这个方法并没有生效,jsp页面对应的标签中还是没有内容,是否是这个方法对jsp不生效还是jsp中命名空间没有正确导入?

回复
李硕硕 7天前

报404就是没找到路径,web-info文件夹里的东西是不能直接访问的,还有就是你这个应该是SpringMVC框架,不能直接访问物理视图,SpringMVC会把你请求的url去Controller里找,也就是和@RequestMapping注解去匹配,但是你又没有这个url的RequestMapping,所以就会报404,建议你把window.location.href跳到一个@RequestMapping注解的地址去,然后在Controller里再去跳响应的物理地址。

回复 1
@李硕硕 嗯,确实是 WEB-INF权限的问题,问题已经解决,非常感谢
回复

web-info 下边的页面是无法直接从js访问的,你可以吧views文件夹拿到webapps下边然后从前端去直接访问页面,或者先从前端到后台控制器,然后到web-info下的页面

回复 1
@生活不易,活在当下 嗯,已经搞定,这个细节问题忽略了,感谢感谢!
回复
发帖
Java
创建于2007-09-28

4.7w+

社区成员

Java相关技术讨论
申请成为版主
帖子事件
编辑了帖子
2021-09-14 15:24
编辑了帖子
2021-09-14 13:36
创建了帖子
2021-09-13 16:17
社区公告
暂无公告