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浏览器上模拟实现这样的功能.先看看浏览效果: ...
随机推荐
- java缓存适合使用的情况
并非所有的情况都适合于使用二级缓存,需要根据具体情况来决定.同时可以针对某一个持久化对象配置其具体的缓存策略. 适合于使用二级缓存的情况: 1.数据不会被第三方修改 一般情况下,会被hibernate ...
- Vue-router路由基础总结(二)
一.命名路由 有时我们通过一个名称来标识一个路由显得更方便一些,特别是在链接一个路由,或者是执行一些跳转的时候.你可以在创建 Router 实例的时候,在 routes 配置中给某个路由设置名称. 我 ...
- Druid对比Redshift
Redshift 内部使用了亚马逊取得了授权的ParAccel 实时注入数据 抛开可能的性能不同, 有功能性的不同 Druid 适合分析大数据量的流式数据, 也能够实时加载和聚合数据一般来讲, 传统的 ...
- TestNG 四 测试方法之工厂
工厂允许你动态的创建测试.例如,假设你需要创建一个测试方法,并用它来多次访问一个web页面,而且每次都带有不同的参数: public class TestWebServer { @Test(param ...
- PHP数组问题
转换为数组 对于任意 integer , float , string , boolean 和 resource 类型,如果将一个值转换为数组,将得到一个仅有一个元素的数组,其下标为 0,该元素即为此 ...
- mysql导入数据乱码的解决
#mysql -uroot -p -hlocalhost --default-character-set=utf8; mysql>use db_name; mysql>source /ho ...
- 使用Firefly编写简易聊天室
1.创建工程命令行下输入firefly-admin.py createproject chat_rooms(linux在终端输入),<ignore_js_op> firefly会在C盘Us ...
- selenium-Getting Started
1.1. Simple Usage If you have installed Selenium Python bindings, you can start using it from Python ...
- RandomForest&ROC
# -*- coding: utf-8 -*- # __author__ = 'JieYao' from biocluster.agent import Agent from biocluster.t ...
- PHP中根据IP地址判断所在城市等信息
本篇文章由:http://xinpure.com/php-based-on-information-such-as-the-ip-address-in-your-city/ 获得IP地址 在 PHP ...