Detailed description of iframe highly adaptive (same-domain) Instances in javascript, javascriptiframe

Detailed description of iframe highly adaptive (same-domain) Instances in javascript, javascriptiframe

Iframe highly adaptive in javascript (same domain)

The problem of highly adaptive iframe is solved today, but this is only page embedding in the same domain. The following code:

Function SetCwinHeight () {var iframeid = document. getElementById ("frame"); // frame is the iframe id if (document. getElementById) {if (iframeid &&! Window. opera) {if (iframeid. contentDocument & iframeid. contentDocument. body. offsetHeight) {iframeid. height = iframeid. contentDocument. body. offsetHeight;} else if (iframeid. document & iframeid. document. body. scrollHeight) {iframeid. height = iframeid. document. body. scrollHeight ;}}}

When you embed an iframe into a page, you must wait until it is fully loaded before calling SetCwinHeight (). Therefore, when you modify the src value in iframe, you also need to wait for the modified page to be fully embedded before you can call SetCwinHeight () to make it effective. How to place SetCwinHeight (), my solution is to directly call the function in the iframe label, that is, write <iframe onload = "SetCwinHeight ();"> </iframe>, however, this will pollute the html environment, but in js, only one window is used. onload = function () {}. If multiple times are used, the following will overwrite the previous one. So the solution I can think of so far is this one,

When the embedded page is modified, the iframe height also needs to be adjusted. When the js file is directly like this window. onload = function () {SetCwinHeight ();} When SetCwinHeight () is called, the height can be adaptive only when the entire page is refreshed. If the src of iframe is modified, the iframe height is still the height of the previous page. The current page height cannot be adaptive. At first I thought it was SetCwinHeight (), but when I refreshed the entire page, the current page can be self-adaptive again. After this problem occurs, my anxious problem arises again. I am always in a hurry to find a solution to the problem without analyzing the problem, then I found out that the problem was not correct. In this way, it not only wasted time, but also made my mood particularly excited. In this way, my work would not be able to continue. I understood my faults through this work. After a while, I calmed down again to sort out my ideas and analyze the problems and how the program runs, after clicking it, what are the steps for running the program? After analysis, let's see what went wrong and why it went wrong. For example, this error is not a program error, however, an error occurred while running the program. After the whole page is refreshed, the result can be achieved, but after src is modified, the result is no longer displayed, while window. onload = function () {} is executed only after the page is fully loaded, so it should be the loading problem, so you need to wait until the page is loaded before calling SetCwinHeight (). Through such analysis, the problem is finally solved. After this time, I must get rid of this problem, after a problem is encountered, analyze the problem and think about the solution. If you cannot solve the problem, find the corresponding solution. This will not waste time and effort.

Thank you for reading this article. I hope it will help you. Thank you for your support for this site!