问题
Hello I have an iframe in my page which have another iframe in it (nested), the nested iframe loads multiple pages of different height currently i am using the code which works for me but only resize the height of the nested one but I want to resize both iframes (the Main iframe and the another iframe which is used in the main one automatically). I searched for the solution but still no success please help me
Here is the code which i am using in both iframe
<script language="javascript" type="text/javascript">
function resizeIframe(obj) {
obj.style.height = obj.contentWindow.document.body.scrollHeight + 'px';
}
</script>
<iframe name="Stack" src="inline-main.php" frameborder="0" scrolling="no" id="iframe" onload='javascript:resizeIframe(this);' width="1060px">Browser not compatible.</iframe>
回答1:
Put JavaScript in parent page, not inside targeted iframe
I tested your example using the above code in the parent page and the iframed child page, which contains the nested iframe; Both iframes resized as expected.
In your explanation above, you say "Here is the code which i am using in both iframe" (emphasis added), which leads me to think that you have the code inside the targeted iframes, instead of the parent of each targeted iframe.
Below are the basic contents needed in each page:
Parent Page
<script language="javascript" type="text/javascript">
function resizeIframe(obj) {
obj.style.height = obj.contentWindow.document.body.scrollHeight + 'px';
}
</script>
<iframe src="iframe.html" frameborder="0" scrolling="no" onload='javascript:resizeIframe(this);'>Browser not compatible.</iframe>
Outer iframe
<script language="javascript" type="text/javascript">
function resizeIframe(obj) {
obj.style.height = obj.contentWindow.document.body.scrollHeight + 'px';
}
</script>
<iframe src="nested-iframe.html" frameborder="0" scrolling="no" onload='javascript:resizeIframe(this);'>Browser not compatible.</iframe>
Nested iframe
<h1>Hello World</h1>
NOTE: You can only do this on iframes from the same domain. It will not work on cross-domain iframes. Also, if you have access to all of the pages including the parent page, then I wouldn't suggest using iframes for the loading of same-domain content; use AJAX or, if available, a jQuery AJAX-based method [.ajax()
, .get()
, .load()
] instead.
来源:https://stackoverflow.com/questions/23484485/jquery-auto-height-iframe-with-the-nested-iframe