看到网上有这样描述的：

　　现在A页面内分为上下两个部分，上部分是top，下部分分左右，左是treeview右边是iframe，iframe内嵌一个B页面，B页面的内容实质上是个月刊，可以理解为杂志，里面有很多转向到其他页面的连接，问题来了。
如果现在我浏览A页面很长，浏览器滚动条在中间，当我点击B页面的某个连接时，iframe内的页面变了，但是A页面整体无变化，这时滚动条还是在中间的部位，造成的为题就是我看到的iframe里面的内容不是文章的头部，而有可能是直接看到中间部位甚至是尾部(因为我的iframe自适应高度，当文章高度低于iframe高度时他是会收缩的自然的浏览器也就在文章最底部了)。

　　①首先页面的首页是这样的：

　　②然后点击左下部分的“more”按钮，应该展示这样的页面效果，如下：

　　③但是实际上，展示的页面效果是这样的，如下：

　　(1)有一个主页面A,A中嵌入一个iframe框架B，如下：

<body>

<div class="main_body">

        <!--logo-->

        <img class="logo" src="static/images/logo2.png" alt="江苏分中心">

        <!--menu-->

        <div class="main-menu">

            <a href="#" name="link" class="current" onclick="opIframePage(this,'home');">0</a>

            <a href="#" name="link" id="news" onclick="opIframePage(this,'news');">1</a>

            <a href="#" name="link" onclick="opIframePage(this,'train');">2</a>

            <a href="#" name="link" onclick="opIframePage(this,'auth');">3</a>

            <a href="#" style="background: orange; color:#fff;" onclick="regist();">4</a>

        </div>

        <div>

            <iframe id="iframePage" style="width: 100%;height: 1000px;overflow-y:scroll;" frameborder="0">

            </iframe>

        </div>

        <footer>

            <p>fgd</p>

        </footer>

    </div>

</body>

　　打开iframe中的页面：document.getElementById("iframePage").src =url;
　　(2)如果我打开的B页面后，主体页面位于中部或者底部，这就不符合用户的习惯了

　　如何改变？

　　方法一：在父页面做手脚：

function topTo(){

　　document.getElementById(‘iframePage’).scrollIntoView();

}

　　　　其中iframePage是你要定位在页面顶部的元素id，然后在子页面中调用父级页面的方法，parent.topTo();

　　方法二：直接在子页面中写方法：parent.scrollTo(0,0);

　　　　这样就可以显示②步的效果了。

iframe中，页面转换后回到页面的顶部的更多相关文章

  1. iframe中，重新加载页面

    比如在iframe中的页面,设置一个onclick事件的触发函数flush function flush(){ window.location.reload(); }

  2. js控制刷新后回到页面原来位置

    1.document.location.reload(); 2.http://www.jb51.net/article/99749.htm

  3. JS刷新后回到页面顶部

    window.location.href = location.href; 方法一: $(window).scrollTop(0); 方法二:$('html ,body').animate({ scr ...

  4. 转---在ASP.NET MVC中实现登录后回到原先的界面

    有这样的一个需求:提交表单,如果用户没有登录,就跳转到登录页,登录后,跳转到原先表单提交这个页面,而且需要保持提交表单界面的数据. 提交表单的页面是一个强类型视图页,如果不考虑需要保持提交表单界面的数 ...

  5. 在ASP.NET MVC中实现登录后回到原先的界面

    有这样的一个需求:提交表单,如果用户没有登录,就跳转到登录页,登录后,跳转到原先表单提交这个页面,而且需要保持提交表单界面的数据. 提交表单的页面是一个强类型视图页,如果不考虑需要保持提交表单界面的数 ...

  6. vue 获取页面详情后 切换页面时 如何监听用户是否修改过信息

    可以用 beforeRouteLeave 和 updated 来判断.export default { name: 'supplier', components:{cmtWrap,cmtContent ...

  7. fastclick使用与 fastclick ios11.3相关bug原因(ios输入框点击变得不灵敏,ios input失焦后，页面上移，点击不了)

    FastClick 移动设备上的浏览器默认会在用户点击屏幕大约延迟300毫秒后才会触发点击事件,这是为了检查用户是否在做双击.为了能够立即响应用户的点击事件,就有了FastClick. 安装fastc ...

  8. 移动端H5页面返回并且刷新页面（BFcache）

    项目中的需求:点击浏览器中的返回按钮,要让页面重新加载资源.因为这部分的资源每次去加载的内容都不一样,如果返回的时候,还是看到原先的内容,那做这个内容块的意义就很小了:而如果用户看完了这部分内容,再返 ...

  9. session失效刷新后登录页面嵌入在iframe中的前台解决办法

    在前台登录页面中加入JS代码,判断登录页面是否在iframe中,在iframe中就跳转出去 例: //判断是否在iframe中,在里面就跳出去 if (top.location.href != loc ...

随机推荐

  1. bootstrap 在django中的使用

       一.应用 http://www.bootcss.com/进入bootstrap4或bootstrap3中文网,想要快速地将 Bootstrap 应用到你的项目中,有以下两种办法:  1.boot ...

  2. javascript 中利用正则匹配 时间

    本文从百度知道回来中粘贴过来,当做一个笔记,因为,说的很详细 最简单的正则 如 : \d{4}-\d{2}-\d{2}但是实际情况却不是那么简单,,要考虑,有效性和闰年等问题..... 对于日期的有效 ...

  3. Java网络编程一

    1.InetAddress的应用 import java.util.List; import java.math.BigDecimal; import java.net.InetAddress; im ...

  4. Poj1733 Parity Game（带权并查集）

    题面 Poj 题解 反正只要你判断是否满足区间的奇偶性,假设每一位要么是\(1\)要么是\(0\)好了. 假设有\(S\)的前缀和为\(sum[]\),则有: 若\(S[l...r]\)中有奇数个\( ...

  5. 第2天：Ansible-Inventory管理

    在Ansible中,将可管理的服务器集合成为Inventory.因此,Inventory管理便是服务器管理. hosts文件位置 我们知道,Ansible在执行操作时,首先需要确定对哪些服务器执行操作 ...

  6. dijkstra算法模板及其用法

    Dijkstra算法 1.定义概览 Dijkstra(迪杰斯特拉)算法是典型的单源最短路径算法,用于计算一个节点到其他所有节点的最短路径.主要特点是以起始点为中心向外层层扩展,直到扩展到终点为止.Di ...

  7. 【CodeVS 2845】排序的代价

    http://codevs.cn/problem/2845/ 好难的题啊qwq 没想到把排好序的数组的第i位和原数组的第i位的值看成一个单射函数,这样这是一个长度为n的置换. 对于置换的其中一个循环, ...

  8. 【高斯消元解xor方程】BZOJ1923-[Sdoi2010]外星千足虫

    [题目大意] 有n个数或为奇数或为偶数,现在进行m次操作,每次取出部分求和,告诉你这几次操作选取的数和它们和的奇偶性.如果通过这m次操作能得到所有数的奇偶性,则输出进行到第n次时即可求出答案:否则输出 ...

  9. mongodb安装和配置，遇到问题和解决方法

    自己不知道怎么的,心血来潮想重新来安装和配置一下mongodb,之前自己也是按照别人的来整的,印象不深刻.第二遍安装配置遇到很多问题. 弄了两个多小时,期间遇到很多问题: 遇到的主要问题 1.拒绝访问 ...

  10. [转]Syntax error on token "Invalid Character", delete this token 的解决

    原文  http://blog.csdn.net/actsai/article/details/24256987 主题 Eclipse Unicode Java eclipse 中遇到了Syntax ...