为何在iframe里面的按钮要点击两次，iframe才会自动调整到指向的文件的高度

porlam 2009-07-09 04:44:48

网页a.htm有个iframe ，这个iframe指向了b.htm ，现在b.htm有个按钮，点击按钮以后b.htm的总体页面高度会增大或缩小，但不知道怎样可以令a.htm的iframe高度也随着增大或缩小。
现在的代码如下，iframe的高度可以增大或缩小，但需要点击两次在b.htm中的按钮才会实现，我想知道如何才能点击一次就增大或缩小？

a.htm的代码

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<style type="text/css">

</style>
</head>

<body>
<table width="100%" border="0" align="center" cellpadding="0" cellspacing="0">
<tr>
<td height="30" align="center"><iframe src="b.htm" name="sample" width="614" marginwidth="0" marginheight="0" scrolling="No" frameborder="0" id="sample" onload="this.height=this.contentWindow.document.body.scrollHeight;"></iframe></td>
</tr>
</table>
</body>
</html>

b.htm的代码

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<style type="text/css">

</style>
<script type="text/javascript" language="javascript">
function GetPhoto(photourl)
{
document.getElementById("image").src=photourl;
parent.window.document.all.sample.height=document.body.scrollHeight;
}
</script>
</head>

<body>
<table width="600" border="0" cellspacing="0" cellpadding="0">
<tr>
<td align="left" valign="top"><img src="a.jpg" name="image" id="image" /></td>
</tr>
<tr>
<td height="30"> </td>
</tr>
</table>
<table width="600" border="0" cellspacing="1" cellpadding="0">
<tr>
<td align="left" valign="top"><br>
<a href="#"><img src="a_s.jpg" width="60" height="60" border="0" onClick="GetPhoto('a.jpg')" /></a><a href="#"><img src="b_s.jpg" width="60" height="60" border="0" onClick="GetPhoto('b.jpg')" /></a></td>
</tr>
</table>
<table width="600" border="0" cellpadding="0" cellspacing="0">
<tr>
<td align="left" valign="top">| 重点案例 | 品牌形象 |</td>
</tr>
</table>
</body>
</html>

a.jpg是一个600*360像素的图片，b.jpg是一个240*400的图片，a_s.jpg和b_s.jpg分别是它们的缩略图

...全文

159 2 打赏收藏转发到动态举报

写回复

用AI写文章

2 条回复

切换为时间正序

请发表友善的回复…

发表回复

porlam 2009-07-09

打赏
举报

好，解决问题了，感谢楼上的，马上给分～～

浪尖赏花 2009-07-09

打赏
举报

是由于计算高度的时候，图片还没有加载好

parent.window.document.all.sample.height=document.body.scrollHeight;

===>

document.getElementById("image").onload = function(){

    parent.window.document.all.sample.height=document.body.scrollHeight; 

}

-修正CheckBox控件的CheckedChanged事件会被触发两次的BUG（Data PostBack->AutoPostBack, Event PostBack->EnablePostBack）。 -为TextBox,TextArea,DatePicker,NumberBox,TriggerBox等控件增加AutoPostBack属性...

HTML是网页制作最基础的编程语言，本课程主要介绍html语言，以及html标签、html文件结构、head标签,还有在html中的注释代码的作用。除此之外课程还回讲解HTML中的常见标签，如div，p，a，span，ul，li，table，form...

4、修复tabs.add方法，当useiframe=true时, iframe的高度改为100%。 5、修复当tabs使用iframe时，右键菜单刷新报错问题。 6、增加combotree对简单数据格式和类标准数据格式的加载，具体参考jquery.easyui.tree....

说明：只在不选择任何内容的情况下才会用到这个参数值 modalWidth：showModal弹出窗口的默认宽度参数值：数值，默认为350 说明：弹出窗口的默认宽度 modalHeight：showModal弹出窗口的默认高度参数值：数值，默认...

CSS

61,112

社区成员

60,730

社区内容

发帖

与我相关

我的任务

社区管理员

加入社区

近7日
近30日
至今

加载中

查看更多榜单

社区公告

暂无公告

试试用AI创作助手写篇文章吧

+ 用AI写文章