iframe实用操作锦集

前端技术 2023/09/06 JavaScript
iframe高度设置为子页面高度
复制代码 代码如下:

//需要使用Jquery
$(document).ready(function () {
parent.document.getElementById(\"ifPage\").style.height = document.body.scrollHeight + \"px\";
});

iframe高度自适应于父页面
复制代码 代码如下:

//需要使用Jquery
$(window).resize(function () {
var webheight = document.body.clientHeight - X; //X是需要减去的高度量，例如顶部导航的高度
$(\"#ifPage\").attr(\"style\", \"height:\" + webheight + \"px;\");
});
$(window).load(function () {
var webheight = document.body.clientHeight - 105;
$(\"#ifPage\").attr(\"style\", \"height:\" + webheight + \"px;\");
});

父子页面间传递元素
父页面获取子页面中的数据，JS代码：
复制代码 代码如下:

//根据iframe的id获取对象
var i1 = window.frames[\'iframeId\'];
//var iframe =window.frames[0];也可以
//获取iframe中的元素值
var val=i1.document.getElementById(\"t1\").value

子页面获取父页面中的数据，JS代码：
复制代码 代码如下:

var val = parent.document.getElementById(\"txt1\");

子页面与子页面间的传递，JS代码：
复制代码 代码如下:

var i1 = parent.window.frames[\'iframeId\'];
var val = i1.document.getElementById(\"text1\").value;

刷新父页面
复制代码 代码如下:

function parentReload() { window.parent.location.reload();}

重新加载子页面
复制代码 代码如下:

iframe.Attributes[ \"Src\"] = \"ItemTQEditorPage.aspx\";

本文地址：https://www.stayed.cn/item/14986

转载请注明出处。

本站部分内容来源于网络,如侵犯到您的权益,请 联系我

我的博客

人生若只如初见，何事秋风悲画扇。

我的标签

随笔档案