预览博客功能

<script type="text/javascript" th:inline="javascript">
	//预览按钮触发方法
	function previewBlog(){
		//在新页面中放置表单(Blog)
		//从前端页面取值 
		var formContent = 
			'+$("#subImageText").val()+'">'+
			
			''+
			''+
		'';
		//打开新页面   [[@{~/previewForm}]]可以替换为要打开的新窗口的地址"url"
		var win = window.open([[@{~/previewForm}]],"_blank");
		setTimeout(function(){
			//给表单放置博客内容
			win.document.forms[0].innerHTML = formContent;
		//让新页面的表单提交,跳转到previewBlog处理显示数据
			win.document.forms[0].submit();
			},50
		);
		//previewBlog Controller后台处理封装数据
		//封装后的数据显示到预览页面
	}
</script>

预览前要填充数据的表单页面previewForm.html

DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org" xmlns:layout="http://www.ultraq.net.nz/thymeleaf/layout">
<head>
<meta charset="UTF-8">
<title>预览博客的表单title>
head>
<body>
	<form th:action="@{~/previewBlog}" id="form" method="post" enctype="multipart/form-data">
	form>
body>
html>

previewBlog Controller处理数据

	@RequestMapping("/previewBlog")
	public String previewBlog(Blog blog,String moodId,String catalogString,ServletRequest request) {
		
		//TODO 基础字段,关联字段
//		System.out.println(blog);
//		System.out.println(moodId);
//		System.out.println(catalogString);
		
//		封装数据,略

		//放置数据
		request.setAttribute("blog", blog);
		request.setAttribute("mood", mood);
		request.setAttribute("catalogList", catalogList);
		
		return "/preview-blog.html";
	}

你可能感兴趣的:(Java,javascript,前端,java)