21'C 흐림
서울 강남구
iframe 제어하기
- iframe을 코딩한다.
<body>
<div id="wrapper">
<iframe id="frame" src="" width="100%" height="100%" frameborder="0" allowtransparency="true" onload="autoResize(this)">
<body id="frameBody">
<form name="form" method="post" target="_self" id="form">
<input type="text" id="inp" name="inp" value="하하하" />
</form>
</body>
</iframe>
</div>
</body>
1) iframe에 접근하여 width, height 값을 설정해줄 수 있다.
<script type="text/javascript">
//iframe size set
function autoResize(i) {
//#wrapper만큼 width값 설정하기.
var wrapW = $("#wrapper").width();
$("#frame").width(wrapW-20);
$("#frame").contents().find("#frameBody").width(wrapW-20);
//iframe height 자동설정.
var iframeHeight=
(i).contentWindow.document.body.scrollHeight;
(i).height=iframeHeight+20;
}
</script>
2) iframe이 포함하는 자식엘리먼트의 값을 가지고 올 수 있다.
<script type="text/javascript">
//#form의 name 가져오기.
var set_nm = $("#frame").contents().find("#form").attr("name");
//#inp의 value값 가져오기.
var set_val = $("#frame").contents().find('#inp').attr("value");
</script>