spring mvc json ajax jquery

最新推荐文章于 2025-08-21 23:22:44 发布

apus9527

最新推荐文章于 2025-08-21 23:22:44 发布

阅读量527

点赞数

CC 4.0 BY-SA版权

分类专栏： springMVC入门文章标签： javascript json 测试 ViewUI

本文链接：https://blog.youkuaiyun.com/apus9527/article/details/43230759

springMVC入门专栏收录该内容

6 篇文章

订阅专栏

本文介绍了一个基于Java和Spring MVC的论坛系统实现案例，包括前端页面展示、后端控制器处理逻辑及所需依赖库。前端通过AJAX请求获取版块下的帖子列表，并动态展示在页面上；后端控制器负责处理请求并返回JSON格式的数据。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

1.前台页面

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<%@ taglib prefix="c"  uri="http://java.sun.com/jsp/jstl/core" %>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>论坛版块</title>
<style type="text/css">
   h1{
    color:red;
    text-align: center;
   }
</style>
<script type="text/javascript" src="../resources/js/jquery.js"></script>
</head>
<% 
cn.springmvc.model.User user = (cn.springmvc.model.User)session.getAttribute("user");
<strong>String path = this.getServletContext().getContextPath();</strong>
%>
<script type="text/javascript">

$(document).ready(function(){
  $("a[name='showTopic']").click(function(){
	var boardId = this.id;
	boardId = boardId.substring(10,boardId.length);
	<strong>$.ajax({</strong>
		type:'GET',
		<strong>contentType:'application/json',</strong>
		url:'../topics/mainTopic.html',
		<strong>dataType:'json',</strong>
		data:{ id: boardId },
		success:function(data){
		<strong>if (data&&data.success=="true"){</strong>
            $('#topic_ls_'+boardId).html("共"+data.total+"条数据。<br/>");
           <strong> $.each(data.data,function(i, item){</strong>
              $('#topic_ls_'+boardId).append(
                "<a href='../posts/mainPost.html?id="+boardId+"'>名称：" + item.topicTitle+"</a> | 创建者："+item.userId+" | 创建时间："+item.createTime+"<br/>");
            });
          }
        },
		error:function(){
			alert("error");
		}
	})
  })
});

</script>
<body>
<h1>版块列表</h1>
<div id="showTopic12" >
</div>
  <c:forEach items="${boards }"  var="board">
     ${board.boardId }--<a  id="showTopic_${board.boardId }"  name="showTopic"  href="javascript:void(0);">${board.boardName }</a>--${board.boardDesc }--${board.topicNum }<br/>
     <div id="topic_ls_${board.boardId }">${board.boardId }</div>
  </c:forEach>
</body>
</html>

2.java文件

@Controller
@RequestMapping("/posts")
public class PostController {

	@Autowired
	private PostService postService;

	@RequestMapping(value = "/mainPost", method = RequestMethod.GET)
	public String getPostList(String id, Model model) {
		List<Post> mainPosts = postService.getMainPostListById(id);
		model.addAttribute("mainPosts", mainPosts);
		return "post/post_list";
	}

	@RequestMapping(value = "/Posts", method = RequestMethod.GET)
	<strong>@ResponseBody</strong>
	public <strong>Map<String, Object></strong> getPostList(String id) {
		List<Post> posts = postService.getPostListById(id);

		Map<String, Object> modelMap = new HashMap<String, Object>();
		<strong>modelMap.put("total", posts.size());
		modelMap.put("data", posts);
		modelMap.put("success", "true");</strong>
		return modelMap;
	}
}

3.jar文件

jackson-core-asl-1.9.12.jar

jackson-mapper-asl-1.9.12.jar

4.配置文件

<mvc:annotation-driven /> 
<bean id="jacksonMessageConverter"
class="org.springframework.http.converter.json.MappingJacksonHttpMessageConverter">
<property name="supportedMediaTypes">
<list>
<value>text/html;charset=UTF-8</value>
</list>
</property>
</bean>