專案背景:
部署本地服務器專案,后臺管理系統內需要用iframe嵌入另一個功能專案,需要能夠互相傳值進行操作
問題:
翻譯之后是跨域了,因為瀏覽器的同源策略問題
解決方法:
1:父頁面向子iframe傳值
(在父頁面的js里獲取到iframe,然后向iframe傳值,然后這么寫就行了,第一個引數是需要傳的資料,也可以是物件)
var frame = document.getElementsByClassName('interfaceEditor')[0];
frame.contentWindow. postMessage ("資料", '*');
(在子iframe的js里監聽獲取父頁面傳的值)
window. addEventListener ('message', function(event) {
//event.data獲取傳過來的資料
console.log(event.data)
});
2:子iframe向父頁面傳值
(在子iframe里面這么寫. data是資料, 第二引數是你父頁面的地址)
window.parent.postMessage(data,'http://localhost:8080/');
(在父頁面這么寫,e.data就是子頁面傳的資料.)
window.addEventListener('message',function(e){
var Date=e.data;
console.log(Date)
},false);
專案實測成功
轉載請註明出處，本文鏈接：https://www.uj5u.com/ruanti/1473.html
標籤：其他
下一篇：記錄坎坷的面試