编程 Javascript

iframe 上下滚动条如何默认在下方实现原理

Posted in Javascript onDecember 10, 2012

问题：iframe 上下滚动条如何默认在下方，做的是聊天工具，数据多了，每次刷新出现的上下滚动默认在上方，还需下拉到下面才能看到聊天记录，有办法让它出现在下方吗?
答案：直接在iframe里写window.scrollTo(0,9999999)或者设置div等容器的scrollTop

document.getElementById(“x”).scrollTop = document.getElementById(“x”).scrollHeight 
window.scrollTo(0,9999999)

这个是解决了在下方，但是有新信息后，滚动条不会自动到下方，我是希望像qq聊天窗口一样，有新内容了，自动到最下方，应该如何来解决呢？

那就应该判断当前生成的内容是什么位置，即它的top或者margin-top是多少，再设置滚动条的高度，这个就可以了，每次生成就调用一下滚动条的高度变化，每次得到的新数据后，再调用 window.scrollTo(0,9999999)这个方法，就可以解决这个问题了！

iframe 上下滚动条如何默认在下方实现原理

声明：登载此文出于传递更多信息之目的，并不意味着赞同其观点或证实其描述。

Javascript 相关文章推荐

JQuery中的$.getJSON 使用说明

Mar 10 Javascript

JS常用字符串处理方法应用总结

May 22 Javascript

JavaScript立即执行函数的三种不同写法

Sep 05 Javascript

javascript arguments使用示例

Dec 16 Javascript

jQuery使用$.ajax进行即时验证的方法

Dec 08 Javascript

JS中frameset框架弹出层实例代码

Apr 01 Javascript

基于VUE选择上传图片并页面显示（图片可删除）

May 25 Javascript

Javascript实现从小到大的数组转换成二叉搜索树

Jun 13 Javascript

Angular中ng-repeat与ul li的多层嵌套重复问题

Jul 24 Javascript

webpack4 + react 搭建多页面应用示例

Aug 03 Javascript

ExtJs使用自定义插件动态保存表头配置(隐藏或显示)

Sep 25 Javascript

浅谈JavaScript闭包

Apr 09 Javascript

Ajax执行顺序流程及回调问题分析

Dec 10 #Javascript

js切换div css注意的细节

Dec 10 #Javascript

不同的jQuery API来处理不同的浏览器事件

Dec 09 #Javascript

addEventListener和attachEvent二者绑定的执行函数中的this不相同

Dec 09 #Javascript

Javascript获取窗口(容器)的大小及位置参数列举及简要说明

Dec 09 #Javascript

定义JavaScript二维数组采用定义数组的数组来实现

Dec 09 #Javascript

javascript操作JSON的要领总结

Dec 09 #Javascript

You might like

加速XP搜索功能堪比vista

2007/03/22 PHP

解析dedeCMS验证码的实现代码

2013/06/07 PHP

php中url函数介绍及使用示例

2014/02/13 PHP

php实现微信支付之退款功能

2018/05/30 PHP

JS控制表格隔行变色

2006/06/26 Javascript

非常漂亮的JS代码经典广告

2007/10/21 Javascript

CheckBoxList多选样式jquery、C#获取选择项

2013/09/06 Javascript

js将控件隐藏及display属性的使用介绍

2013/12/30 Javascript

jQuery事件的绑定、触发、及监听方法简单说明

2016/05/10 Javascript

详解JavaScript中this关键字的用法

2016/05/26 Javascript

移动端脚本框架Hammer.js

2016/12/15 Javascript

JS字符串长度判断,超出进行自动截取的实例(支持中文)

2017/03/06 Javascript

详解Vue2.x-directive的学习笔记

2017/07/17 Javascript

vue-router重定向不刷新问题的解决

2018/06/25 Javascript

利用React Router4实现的服务端直出渲染(SSR)

2019/01/07 Javascript

Javascript通过控制类名更改样式

2019/05/24 Javascript

微信小程序实现图片压缩

2019/12/03 Javascript

python 从远程服务器下载日志文件的程序

2013/02/10 Python

web.py在模板中输出美元符号的方法

2014/08/26 Python

Python实现图片滑动式验证识别方法

2017/11/09 Python

python学习笔记之列表(list)与元组(tuple)详解

2017/11/23 Python

python中文乱码不着急，先看懂字节和字符

2017/12/20 Python

python调用tcpdump抓包过滤的方法

2018/07/18 Python

Python os.rename() 重命名目录和文件的示例

2018/10/25 Python

Python测试框架：pytest学习笔记

2020/10/20 Python

Canvas绘制浮动球效果的示例

2017/12/29 HTML / CSS

英国领先的酒类网上商城：TheDrinkShop

2017/03/16 全球购物

Java面试题：说出如下代码的执行结果

2015/10/30 面试题

土地转让协议书范本

2014/04/15 职场文书

难忘的一天教学反思

2014/04/30 职场文书

党性锻炼的心得体会

2014/09/03 职场文书

整顿机关作风心得体会

2014/09/10 职场文书

百年孤独读书笔记

2015/06/29 职场文书

2017年寒假社区服务活动总结

2016/04/06 职场文书

基于PyQT5制作一个桌面摸鱼工具

2022/02/15 Python

Mybatis-Plus 使用 @TableField 自动填充日期

2022/04/26 Java/Android