JS获取scrollHeight问题想到的标准问题


Posted in Javascript onMay 27, 2007

我在作一个iframe自动调整高度时,被嵌入的页面commit.asp的代码如下:

<!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=gb2312" /> 
<title>的相关评论</title> 
<style type="text/css"> 
<!-- 
body { 
margin-left: 0px; 
margin-top: 0px; 
margin-right: 0px; 
margin-bottom: 0px; 
} 
--> 
</style> 
</head> 
<body bgColor="transparent" onload="zoomiframe();"> 
</body> 
</html> 
<script language=javascript> 
<!--框架页自动调整尺寸--> 
function zoomiframe() 
{ 
parent.document.getElementById("comment_load").style.height=document.documentElement.scrollHeight; 
} 
</script>

然后在另外的页面插入其它代码,将这页嵌入到其它页面
<iframe src="comment.asp?classid=2&id=12" allowtransparency="true" name="comment_load" width="540" height="288" marginwidth="0" marginheight="0" align="middle" scrolling="no" frameborder="0"></iframe>

但是没有效果,iframe不能按照内容自动调高度。
后来我在zoomiframe()加入了一句alert(document.body.scrollHeight);。弹出来的值为0,但如果直接运行COMMIT。ASP弹出的高度却与内容相符。
实在搞不明白那里有冲途。我以前这样作可以,不知道论坛上有没有那个遇过这种问题。
谢谢!

parent.document.all("comment_load").style.height=document.body.scrollHeight||document.documentElement.scrollHeight;

试了一下,应该是没什么问题的
<script type="text/javascript">
<!--
onload=function()
{
parent.document.getElementById('ac').style.height="200px";
}
//-->
</script>

<iframe src="comment.asp?classid=2&id=12" allowtransparency="true" name="comment_load" width="540" height="288" marginwidth="0" marginheight="0" align="middle" scrolling="no" frameborder="0"></iframe>

加一个ID属性

PS:如果网页中加入以下头

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

必须用 document.documentElement.scrollHeight关于这方面的东西
如果没有文档声明可以用
document.body.scrollHeight
Javascript 相关文章推荐
jQuery 1.5.1 发布,全面支持IE9 修复大量bug
Feb 26 Javascript
jquery必须知道的一些常用特效方法及使用示例(整理)
Jun 24 Javascript
javascript获得网页窗口实际大小的示例代码
Sep 21 Javascript
jQuery实现控制文字内容溢出用省略号(…)表示的方法
Feb 26 Javascript
javascript数组常用方法汇总
Sep 10 Javascript
常用jQuery选择器汇总
Feb 02 Javascript
js省市区级联查询(插件版&amp;无插件版)
Mar 21 Javascript
WdatePicker.js时间日期插件的使用方法
Jul 26 Javascript
jQuery选择器之属性筛选选择器用法详解
Sep 19 jQuery
javaScript日期工具类DateUtils详解
Dec 08 Javascript
微信小程序日历效果
Dec 29 Javascript
JavaScript 处理树数据结构的方法示例
Jun 16 Javascript
如何实现动态删除javascript函数
May 27 #Javascript
javascript实现 在光标处插入指定内容
May 25 #Javascript
向fckeditor编辑器插入指定代码的方法
May 25 #Javascript
用Javscript实现表单复选框的全选功能
May 25 #Javascript
更正确的asp冒泡排序
May 24 #Javascript
asp 的 分词实现代码
May 24 #Javascript
OfflineSave离线保存代码再次发布使用说明
May 23 #Javascript
You might like
php图片加水印原理(超简单的实例代码)
2013/01/18 PHP
PHP输出XML格式数据的方法总结
2017/02/08 PHP
ThinkPHP使用getlist方法实现数据搜索功能示例
2017/05/08 PHP
PHP环形链表实现方法示例
2017/09/15 PHP
php记录搜索引擎爬行记录的实现代码
2018/03/02 PHP
PHP基于rabbitmq操作类的生产者和消费者功能示例
2018/06/16 PHP
Node.js:Windows7下搭建的Node.js服务(来玩玩服务器端的javascript吧,这可不是前端js插件)
2011/06/27 Javascript
ajax中get和post的说明及使用与区别
2012/12/23 Javascript
js时间比较示例分享(日期比较)
2014/03/05 Javascript
js不能获取隐藏的div的宽度只能先显示后获取
2014/09/04 Javascript
用javascript关闭本窗口技巧小结
2014/09/05 Javascript
node.js解决获取图片真实文件类型的问题
2014/12/20 Javascript
javascript实现表格排序 编辑 拖拽 缩放
2015/01/02 Javascript
js实现精美的银灰色竖排折叠菜单
2015/05/16 Javascript
JSONObject使用方法详解
2015/12/17 Javascript
Web打印解决方案之普通报表打印功能
2016/08/29 Javascript
javascript表单控件实例讲解
2016/09/13 Javascript
JS高仿抛物线加入购物车特效实现代码
2017/02/20 Javascript
微信小程序上传文件到阿里OSS教程
2019/05/20 Javascript
nodejs中实现用户注册路由功能
2019/05/20 NodeJs
使用vue制作滑动标签
2019/09/21 Javascript
微信小程序自定义头部导航栏(组件化)
2019/11/15 Javascript
vue-cli3 热更新配置操作
2020/09/18 Javascript
python 重定向获取真实url的方法
2018/05/11 Python
Python实现的对本地host127.0.0.1主机进行扫描端口功能示例
2019/02/15 Python
python实现机器人卡牌
2019/10/06 Python
pytorch-RNN进行回归曲线预测方式
2020/01/14 Python
Tensorflow 使用pb文件保存(恢复)模型计算图和参数实例详解
2020/02/11 Python
PyTorch中torch.tensor与torch.Tensor的区别详解
2020/05/18 Python
Python修改DBF文件指定列
2020/12/19 Python
澳大利亚制造的蜡烛和扩散器:Glasshouse Fragrances
2018/05/20 全球购物
德国家具折扣店:POCO
2020/02/28 全球购物
2014国庆65周年领导讲话稿(3篇)
2014/09/21 职场文书
就业意向协议书
2015/01/29 职场文书
企业文化学习心得体会
2016/01/21 职场文书
Vue提供的三种调试方式你知道吗
2022/01/18 Vue.js