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浏览器上模拟实现这样的功能.先看看浏览效果: ...
随机推荐
- pthread_getspecific和pthread_setspecific使用
pthread_getpecific和pthread_setspecific实现同一个线程中不同函数间共享数据的一种很好的方式. #more test.c /* * ================= ...
- 在移动网页网页上点击链接跳转到QQ聊天界面
打开qq聊天窗口的方法 <a href="http://wpa.qq.com/msgrd?v=3&uin=1450612626&site=qq&menu=yes ...
- 【JavaScript】ReactJS基础
初探React,将我们的View标签化 前言 我之前喜欢玩一款游戏:全民飞机大战,而且有点痴迷其中,如果你想站在游戏的第一阶梯,便需要不断的练技术练装备,但是腾讯的游戏一般而言是有点恶心的,他会不断的 ...
- Eight_pku_1077(广搜).java
Eight Time Limit: 1000MS Memory Limit: 65536K Total Submissions: 21718 Accepted: 9611 Special ...
- .NET/MVC-ViewBag、ViewData、TempData区别
1.ViewData ViewData的生命周期和View相同, 只对当前View有效. 2.TempData TempData保存在Session中, Controller每次执行请求的时候会从Se ...
- 转： 加快Android编译速度
转: http://timeszoro.xyz/2015/11/25/%E5%8A%A0%E5%BF%ABandroid%E7%BC%96%E8%AF%91%E9%80%9F%E5%BA%A6/ 加快 ...
- Handler（2）
andriod提供了Handler 和 Looper 来满足线程间的通信.Handler先进先出原则.Looper类用来管理特定线程内对象之间的消息交换(MessageExchange). 1)Loo ...
- .NET Framwork 之 源代码编译成托管代码托管代码合并成程序集
我们都知道,C#程序需要在 .NET Framework 的环境中运行. 一.程序运行所需的三个关键 1.IL(中间语言):编译器编译源代码时生成的代码. 2. Framework类库(Framewo ...
- axios [æk'si:əʊs] 及 axios 请求配置
特征 比Jquery轻量,但处理请求不多的时候,可以使用 基于Promise语法标准 支持nodejs 自动转换JSON数据 用法 get // Make a request for a user w ...
- MQTT---HiveMQ源代码具体解释(七)Netty-SSL/NoSSL
源博客地址:http://blog.csdn.net/pipinet123 MQTT交流群:221405150 实现功能 依据用户配置的不同的Listener(TcpListener.TlsTcpLi ...