jsp中iframe填充装个页面

最新推荐文章于 2022-06-28 16:45:20 发布

weixin_30378623

最新推荐文章于 2022-06-28 16:45:20 发布

阅读量137

点赞数

文章标签： javascript java ViewUI

原文链接：http://www.cnblogs.com/zhuzhixijiang/p/5112245.html

版权

首先要引入这个css,由于我之前没有引入这个,导致iframe的高度一只是默认高度,没有改变

<style type="text/css">
body, html {
    width: 100%;
    height: 100%;
}
</style>

iframe的设置例子:

<iframe id="treeIframe" frameborder="0" width="20%" scrolling="yes"
            height="95%" src="listHbase.do" style="float: left;"></iframe>

整个的jsp例子,

<%@ 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">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
<link href="css/web_common.css" rel="stylesheet" type="text/css" />

<style type="text/css">
body, html {
    width: 100%;
    height: 100%;
}
</style>
</head>
<body  >
 
    
        <iframe id="treeIframe" frameborder="0" width="20%" scrolling="yes"
            height="95%" src="listHbase.do" style="float: left;"></iframe>
    
    
        <iframe id="tableIframe" frameborder="0" width="80%" scrolling="yes"
            height="95%" src="table.do" style="float: right;"></iframe>

     
    <!-- 用于调试页面对iframe的大小
<div class="content" id="content">
        <iframe id="frame3d" name="frame3d" 
            frameborder="0" width="100%" scrolling="yes" height="100%"
            src="table.do"></iframe>

    </div>
      -->
</body>
</html>

效果的样子:

如果上面的还不行，就加上这个

<script type="text/javascript">
    function setContentHeight() {
        document.getElementById("content").style.height = document.body.clientHeight
                - 150 + "px";
    }
</script >

记得在<body>上调用