iframejs_js如何關閉彈出的iframe

① 頁面如何在載入的時候就調用iframe內的js方法

其實iframe是一個獨立的頁面，與父頁面是嵌套但變數獨立的關系。所以iframe載入時，如果js方法不涉及操作文檔對象（DOM），就直接調用；如果該js方法涉及操作dom，就添加window.onload事件觸發函數處理，在處理函數內調用js方法

② js中監聽iframe點擊事件

在js中，需要監聽iframe的點擊事件，但是因為瀏覽器的同源策略，是無法監聽到的，只能另闢蹊徑去解決它

注意，僅限於pc網站，意思就是必須要有滑鼠移入移出iframe的操作

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

<html>

<head>

<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">

<title>Detect IFrame Clicks</title>

<script src="./jquery-3.4.1.min.js"></script>

<script type="text/javascript">

    $(document).ready(function() {

        var currentObj=Object

        var isOverIFrame = false;

        function processMouseOut(e) {

            console.log('out iframe',e.target);

            currentObj=e.target

            isOverIFrame = false;

            top.focus();

        }

        function processMouseOver(e) {

            // log("IFrame mouse >> OVER << detected.");

            console.log('in iframe',e.target);

            currentObj=e.target

            isOverIFrame = true;

        }

        function processIFrameClick(event) {

            if(isOverIFrame) {

                console.log('click iframe',event.target,currentObj);

            }

        }

        function attachOnloadEvent(func, obj) {

            if(typeof window.addEventListener != 'undefined') {

                window.addEventListener('load', func, false);

            } else if (typeof document.addEventListener != 'undefined') {

                document.addEventListener('load', func, false);

            } else if (typeof window.attachEvent != 'undefined') {

                window.attachEvent('onload', func);

            } else {

                if (typeof window.onload == 'function') {

                    var oldonload = onload;

                    window.onload = function() {

                        oldonload();

                        func();

                    };

                } else {

                    window.onload = func;

                }

            }

        }

        function init() {

            var element = document.getElementsByTagName("iframe");

            for (var i=0; i<element.length; i++) {

                element[i].onmouseover = processMouseOver;

                element[i].onmouseout = processMouseOut;

            }

            if (typeof window.attachEvent != 'undefined') {

                top.attachEvent('onblur', processIFrameClick);

            }

            else if (typeof window.addEventListener != 'undefined') {

                top.addEventListener('blur', processIFrameClick, false);

            }

        }

        attachOnloadEvent(init);

    });

</script>

</head>

<body>

<iframe src="https://www.hao123.com" width="80%" height="600px"></iframe>

<iframe src="https://www..com" width="80%" height="600px"></iframe>

</form>

</body>

</html>

復制上邊整段html，打開console控制台，即可解決這個問題，親測好用

③ iframe中的頁面怎麼引用js文件

調用父窗口函數
window.parent.POPUP('bigFram');
父窗口調用iframe子窗口方版法權
<iframe name="myFrame" src="child.html"></iframe>
myFrame.window.functionName();
iframe子窗口調用父窗口方法
parent.functionName();
用js互相調用iframe頁面內的js函數。

④ js如何關閉彈出的iframe

首先iframe中的頁面應該與父頁面是同域頁面，否則跨域的話js無法控制iframe中的內容。版
如果父頁面與框架中的頁面時權同域的，可以通過改變a標簽的href屬性來實現：

1

<a href="javascript:return false;" onclick="window.open('http://..com/','_self')" target="_blank">猛戳這里</a>

這樣實際是把原來鏈接的作用取消，然後給a標簽綁定js的window.open方法打開頁面，target也就不起作用了。

⑤ js如何操作iframe的跨域問題

A域名下的頁面index.htm中內嵌了一個iframe頁面，iframe內引用的是B域名的sub-index.htm頁面，但是為了避免出
現在index.htm頁面中出現滾動條，需要明確知道sub-index.htm頁面的高度和寬度，可是sub-index.htm的頁面內容是不可控的，可能會根據不同用戶頁面大小會不一樣；問題就是如何把sub-index.htm頁面的高度和寬度傳遞給index.htm頁面？

具體解決：
1、在index.htm頁面中聲明一個js函數process(height, width);用來實現設置頁面內iframe的高度和寬度；
2、
在sub-index.htm頁面中再內嵌一個隱藏的iframe，iframe的src指向A域名下的頁面ex.htm?height=xx&
width=yy，該頁面沒有任何內容，只是用來傳遞sub-index.htm頁面載入完之後的寬度和高度這兩個數據的，頁面內js拿到request
中的參數之後直接調用parent.parent.process(height, width);完成對父頁面寬度和高度的設置；
如圖：

⑥ 如何用js列印 iframe裡面的內容

如果iframe的域名與外部父網頁的域名相同（具體請參考js同源策略），則可以使用如下代碼獲取iframe裡面的內容：

varf=document.getElementById('iframe-id');//獲取到iframe標簽元素
varwin=f.contentWindow;//iframe中的window對象
vardoc=f.contentDocument;//iframe中的document對象
vartext=doc.getElementsByTagName("html")[0].innerHTML;//獲取html標簽下的內容

如果iframe的域名與外部父網頁的域名不相同，則父網頁與子網頁由於js同源策略而相互隔離，不允許互相訪問。這是由於瀏覽器的安全性決定的，無法改變。

⑦ 如何用JS獲取iframe裡面的內容

js 跨域名是取不到iframe里的信息的, 除非同一個域名下.
如果是同一個域名下的.
var win = document.getElementById('frmid').contentWindow;
var frmobj = win.document.getElementById('控制項');

導航:首頁 > 編程語言 > iframejs

iframejs

與iframejs相關的資料

友情鏈接