监听iframe load事件与修改 iframe body样式

$(document).ready(function() {

CreateIframe();//创建iframe

var doc = document.getElementById('ContentFrame').contentDocument.document;

});

function changeStyle()//修改动态创建的iframe的一些样式

{

var x=document.getElementById("ContentFrame");

var y=(x.contentWindow || x.contentDocument);

if (y.document)y=y.document;

y.body.style.backgroundColor = "#f9f9f9";

y.body.style.padding = "0px";

y.body.style.margin = "10px";

y.body.style.fontSize = "small";

y.body.style.maxWidth = "100%";

}

///创建iframe 的方法

function CreateIframe() {

var iframe = document.createElement("iframe");

iframe.src = "Content.aspx?id="+$("#txid").val();//根据相应的id 在页面中显示需要的内容

iframe.setAttribute("id", "ContentFrame");

iframe.setAttribute("width", "100%");

iframe.setAttribute("height", "100%");

iframe.setAttribute("scrolling", "auto");

iframe.setAttribute("frameborder", "0");

if (iframe.attachEvent) {

iframe.attachEvent("onload", function() {

changeStyle();

});

} else {

iframe.onload = function() {

//                        alert("Local iframe is now loaded.");

changeStyle();

};

}

</script>

两段script都是百度后修改成自己要的

推荐阅读更多精彩内容

  • 工厂模式类似于现实生活中的工厂可以产生大量相似的商品,去做同样的事情,实现同样的效果;这时候需要使用工厂模式。简单...
    舟渔行舟阅读 6,730评论 2 17
  • 以下是常用的代码收集,学习用。转自豪情博客园 1. PC - js 返回指定范围的随机数(m-n之间)的公式 re...
    自由加咖啡阅读 731评论 0 1
  • 自适应高度,其实就是设置iframe的高度,使其等于内嵌网页的高度,从而看不出来滚动条和嵌套痕迹。对于用户体验和网...
    布拉德皮蛋_qzy阅读 1,772评论 0 3
  • 我们首先要明白,我们给页面添加效果用到的js到底是什么?js其实包含三部分:dom 文档对象模型 bom 浏览...
    一直以来都很好阅读 464评论 0 0
  • 悠悠玲阅读 96评论 2 3