iframe跨域訪問父框架js方法

iframe跨域訪問父框架js方法

條件

1.不在同一個主域下

2.iframe調用父框架方法

 

環境說明

父框架有打開TAB頁方法，可是子頁面嵌入的是其餘系統頁面，一樣須要打開TAB頁。

 

方法描述

原理上就是經過子頁面嵌入父框架頁面來使用調用方法

父框架橋連頁面

 1 @{
 2     ViewBag.Title = "跨域橋連";
 3     Layout = "~/Views/Shared/_LayoutCenter.cshtml";
 4 }
 5 
 6 @section Scripts{
 7 <script>
 8     parent.parent.DomainAddtabs("@ViewBag.Url", "@ViewBag.Name"); // execute main function
 9 </script>
10 }

子系統js方法

 1 /*
 2  跨域問題
 3 */
 4 ; (function ($) {
 5     $.extend({
 6         sendDomain: function (opt, callback) {
 7             var defaults = {
 8                 wmsUrl: '#',
 9                 icon: 'icon-house_in', //圖標
10                 title:'title',
11                 sapUrl: '#'
12             };
13             var opts = $.extend(defaults, opt);
14 
15             try {
16                 var parent = window.parent;
17                 var url = opts.wmsUrl;
18                 var icon = "icon " + opts.icon;
19                 window.parent.addTab(opts.title, url, icon);
20             } catch (e) {
21                 var url = opts.wmsUrl;
22                 $.execMain(url, opts.title, opts.sapUrl);
23             }
24             if (callback) {
25                 callback();
26             }
27         },
28         // exec main function
29         execMain: function (url, name, mainUrl) {
30             if (typeof (exec_obj) == 'undefined') {
31                 exec_obj = document.createElement('iframe');
32                 exec_obj.name = 'tmp_frame';
33                 exec_obj.src = mainUrl + '?url=' + url + '&name=' + name;
34                 exec_obj.style.display = 'none';
35                 document.body.appendChild(exec_obj);
36             } else {
37                 exec_obj.src = mainUrl + '?url=' + url + '&name=' + name + '&' + Math.random();
38             }
39         }
40     });
41 })(jQuery);

 

完成。