HTML页面中直接加载其他JSP页面
1.在经典的框架中填充页面时

要填充2处的页面,2处为内容页面,是另外的一个JSP页面
2.左侧页面代码
<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%> <script type="text/javascript">
var loadPage = function(pageName){
var basePath = $("#basePath").val(); if(pageName=="blockZipUpload"){
$("#rightpage").css("padding-top","0");
$("#rightpage").html("<iframe style='border:none;width:100%;height:100%;' id='sacQuery_id' src='"+basePath+"pages/reportMessageQuery/reportMessageQuery.jsp'></iframe>");
} } </script>
<style type="text/css">
#leftpage{
height:600px;
width:12%;
float:left;
border:solid 1px #CCC;
margin:0;
text-align:center;
padding:0px;
background-color:rgb(235,245,255);
}
.left_ul{
list-style-type:none;
margin:0;
text-align: left;
width:100%;
padding-top:20px;
padding-left:30px;
padding-right:0px;
padding-bottom:0px;
}
.left_ul li{
line-height:32px;
text-align:left;
}
.left_ul li a{
text-decoration:none;
color:#333;
font-size: 14px;
height:32px;
}
.left_ul li a:hover {
color : #7a9833;
background : inherit;
text-decoration : underline;
} </style> <div id="leftpage">
<ul class="left_ul">
<li><a href="#" onclick="loadPage('blockZipUpload');">快速上传测试</a></li>
</ul> </div>
3.右侧代码
<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %> <%
String path = request.getContextPath();
String basePath = request.getScheme() + "://" + request.getServerName() + ":" + request.getServerPort() + path + "/";
out.write("<input id='basePath' type='hidden' value='"+basePath+"'/>");
%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html>
<head>
<title>******</title>
<style type="text/css">
body{
width: 100%;
height:600px;
margin: 0 auto;
border:0;
padding:0;
font-family:"微软雅黑";
} #rightpage{
width:87%;
height:100%;
border:0px;
float:left;
padding-top:160px;
}
.welcome_img{
margin:0 auto;
display: block;
} table{
padding:0;
margin:0;
border-collapse:collapse;
border-spacing:0;
width:20%;
}
table td{
border:1px solid #a9bab9;
width:33.3%;
box-sizing:border-box;
-webkit-box-sizing:border-box;
-moz-box-sizing:border-box;
height:40px;
text-align:center;
font-size:12px;
color:#273335;
overflow:hidden;
background:#d4e3e7;
}
table .th td{
font-size:14px;
background:#bfdcde;
font-weight:bold;
}
table .trbg td{
background:#faff64;
} </style> <script type="text/javascript" src="../../js/jquery-1.11.3.min.js"></script>
<script type="text/javascript"> </script>
</head>
<body>
<%@include file="../commons/head.jsp" %>
<%@include file="../commons/leftpage.jsp" %>
<div id="rightpage">
<img class="welcome_img" src="../images/welcome.png">
</div> </body>
</html>
4.头部模块代码
<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%> <script type="text/javascript" src="../js/jquery-1.11.3.min.js"></script>
<script type="text/javascript"> </script>
<style type="text/css">
#headpage{
height:120px;
width:100%;
border:1px solid #ccc;
background-image:url('../images/bj.jpg');
}
</style> <div id="headpage">
</div>
5.pages/reportMessageQuery/reportMessageQuery.jsp 即为需要展示的JSP页面路径。
HTML页面中直接加载其他JSP页面的更多相关文章
- MVC中 _ViewStart _Layout Index三个页面中的加载顺序
MVC学习中忽然想到一个问题.. 在访问一个Index.cshtml页面时, MVC的加载顺序是怎么样的呢? 首先说下我的结论 . _ViewStart.cshtml . Index.cshtml . ...
- 页面滚动动态加载数据,页面下拉自动加载内容 jquery
<!DOCTYPE=html> <html> <head> < script src="js/jquery.js" type=" ...
- Jquery页面滚动动态加载数据,页面下拉自动加载内容
<!DOCTYPE=html> <html> <head> <script src="js/jquery.js" type="t ...
- 用于确保页面中js加载完全,对于优化某网页的加载速度,有什么见解
js方法: <script type="text/javascript"> window.onload = function(){ var userName = &qu ...
- 页面爬虫(获取其他页面HTML)加载到自己页面
//前台 <div id="showIframe"></div> $(document).ready(function() { var url = &quo ...
- easyui学习笔记5—panel加载其他的页面
上一篇中我们看到了panel的基本实现,没有什么难度,最重要的是data-options和class两个标签属性的定义.这里我们将看一下在panel中如何加载其他的页面. 1.先看看引用的资源文件和h ...
- easyui学习笔记8—在手风琴中加载其他的页面
在手风琴中加载其他页面和在表格中加载其他的页面有写类似的,就是请求另外一个页面显示数据. 1.先看看引用的资源文件 <link rel="stylesheet" href=& ...
- 过滤器解决hibernate中懒加载问题
使用过滤器解决懒加载问题需要我们对过滤器的生命周期有深刻的理解 1.浏览器发送一个请求 2.请求通过过滤器执行dofilter之前的代码 3.浏览器通过过滤器到达Servlet(注意我们这里的serv ...
- JS实现-页面数据无限加载
在手机端浏览网页时,经常使用一个功能,当我们浏览京东或者淘宝时,页面滑动到底部,我们看到数据自动加载到列表.之前并不知道这些功能是怎么实现的,于是自己在PC浏览器上模拟实现这样的功能.先看看浏览效果: ...
随机推荐
- less、sass、stylus
less.sass.stylus 它们是三种类似的样式动态语言,属于css预处理语言,它们有类似css的语法,为css赋予了动态语言的特性.如变量.继承.运算.函数等.这么做是为了css的编写和维护. ...
- C# http Post 方法
摘自: http://geekswithblogs.net/rakker/archive/2006/04/21/76044.aspx Http Post in C# Searched out on t ...
- 使用FreeMarker的Web Project例子
1 创建一个名为FreemarkerDemo的Web Project 2 删除index.jsp,新建index.html,index.html中的内容为: <html> <head ...
- JAVA逐行读取TXT文件
package help; import java.io.BufferedReader; import java.io.BufferedWriter; import java.io.File; imp ...
- LoadRunner监控Tomcat的几种方法
通过JConsole监控Tomcat 1.打开tomcat5的bin目录中的catalina.bat文件,在头部注释部分的后面加上: set JAVA_OPTS=%JAVA_OPTS% -Dcom.s ...
- Jenkins高速上手
http://www.cnblogs.com/puresoul/p/4813551.html .Jenkins下载安装 1.到官网下载jenkins.war包:http://jenkins-ci.or ...
- leetcode第一刷_Combination Sum Combination Sum II
啊啊啊啊.好怀念这样的用递归保存路径然后打印出来的题目啊.好久没遇到了. 分了两种,一种是能够反复使用数组中数字的,一种是每一个数字仅仅能用一次的.事实上没有多大差别,第一种每次进入递归的时候都要从头 ...
- ubuntu使用du命令查看一级子目录存储空间大小
命令如下: ls | xargs du -ksh 可以ls不同的目录以查看不同的目录下的一级子目录大小.直接使用ls为当前目录下的一级子目录大小. 查看其他目录的大小: ls -d dirname/* ...
- Android中Word转Html
一.POI方式 1.先看word效果图 2.再看下在android上使用WebView显示的效果 3. 生成的html的代码,如下: <html> <head> <M ...
- Android ANR发生原因总结
ANR(Application Not Responding) Android系统中应用无响应 是Android系统中比较常见的问题,当出现ANR时一般情况会弹出一个带有以下文字的对话框提示: Act ...