zoukankan      html  css  js  c++  java
  • 同时刷新两个iframe指向的页面,一个链接关联两个iframe的刷新

    1. index.htm中有多个iframe
     
    <frameset rows="140,1*" frameborder="no" framespacing="0">
    	<frame id="topframe" name="topframe" src="Top.aspx" name="top" scrolling="NO" noresize marginwidth="0" marginheight="0">
    	<frameset cols="200,1*" >
    		<frame id="treeframe" name="treeframe" src="Tree.aspx" name="nav" scrolling="NO" marginwidth="0" marginheight="0">
    		<frame id="bodyframe" name="bodyframe" src="Default.aspx" >
    	</frameset>
    	<!--<frame id="bottomframe" title="bottomframe" name="bottomframe" src="Bottom.aspx" nosesize="noresize" scrolling="no">-->
    </frameset>
     
    在top.aspx中有一个UserControl,有许多a 标签,指向Tree.aspx,
    但我想当点击每个标签时能同时能刷新Default.aspx,
     
    下面是一个UserControl, 由topframe中的Top.aspx引用。 它的href指向的是Tree.aspx, target指向的是treeframe
    所以原则上,它只会对Tree.aspx这个页面产生影响。
    但我希望同时可以让主窗口的能接受这个a标签的key,加载数据.
    <li><a href="javascript:void(0)" class="">报表</a>
    	<ul>
    		<li><a href="../Tree.aspx?key=21" target="treeframe" class="" key="21"
    			 isfixed="1" onclick="DefaultFileList(this);">aaaa</a> </li>
    		<li><a href="../Tree.aspx?key=22" target="treeframe" class="" key="22"
    			 isfixed="1" onclick="DefaultFileList(this);">bbbb</a> </li>
    		<li><a href="../Tree.aspx?key=23" target="treeframe" class="" key="23"
    			 isfixed="1" onclick="DefaultFileList(this);">cccc</a> </li>
    	</ul>
    </li>
     
    解决办法
    onclick="DefaultFileList(this);"
    var DefaultFileList = function (obj) {
    	var key = $(obj).attr("key");
    	parent.bodyframe.location.href = 'Default.aspx?id=' + key;
    	return false;
    }

    其中target="treeframe" 关联iframe id为treeframe的页面,当点击链接时,由onclick事件再关联iframe id为bodyframe的页面,其中href后的链接为要显示内容的地址。

    javascript:parent.bodyframe.location.href中的parent表明了要关联的iframe在上级页面中。

  • 相关阅读:
    postman发送请求携带Cookie
    maven打包相关配置
    springboot使用redis的keyspace notifications 实现定时通知
    JSON使用
    jdk1.8的一些特性
    Mysql--基础(一)
    04 difflib和filecmp
    08 存储引擎
    03 dnspython模块的应用
    02 IPy模块的应用
  • 原文地址:https://www.cnblogs.com/vihone/p/3136850.html
Copyright © 2011-2022 走看看