1. 程式人生 > >跨域 iframe

跨域 iframe

 

我的跨域很簡單,是用 <iframe></iframe> 來做的。

為什麼會用到跨域?

    因為公司業務規定,所有的操作按鈕在最上邊,而且是固定死的都有什麼(CRUD),並且每個業務都一樣,只是通過許可權來限定他的操作(比如不能新增),而且通過按鈕的 CRUD 來操作內容主題區域,所以每個頁面都放按鈕就不是很好了,所以把按鈕放在一個大頁面裡,裡面在嵌入 <iframe> 來控制顯示的 jsp。而且應用環境也是比較老的,專案也是老的。

詳細的解析一下 <iframe> 裡面的屬性,(本文名詞解釋:子頁面指的是 iframe 返回的頁面,父頁面指的是包含 iframe 的頁面)

    id 用來取子頁面(<iframe> 裡面的頁面)的表單資料。

    src 規定在 iframe 中顯示的文件的 URL(後臺或者 jsp,我的這個是 struts2 的 .action)

    frameborder 用來規定顯示框架周圍的邊框

    scrolling 用來規定在 iframe 中顯示滾動條

    name 定位返回的 jsp 在哪個區域顯示

    

 

跨域取值:

var object = document.getElementById('iframeBusiness').contentWindow.document.getElementById('inputID');

給 iframe 修改路徑:$("#iframeBusiness").attr({src:""});

表單提交(驗證)失敗,獲得焦點:

document.getElementById('iframeBusiness').contentWindow.document.getElementById('inputID').focus();

document.getElementById('iframeBusiness').contentWindow.$('#inputID').focus(); // 相容IE (我用的是 11)

(需要注意的是,如果需要 alert,則寫在 alert 前面,即先獲得焦點,在 alert)

記住:

1、只要是獲取子頁面表單元素的值,必須用跨域的方式取,不論是在哪個頁面,父頁面也好,子頁面也好,都得這麼拿。

2、父頁面裡取父頁面,子頁面裡取子頁面都按照正常取就行(doc&jquery)。

3、而在子頁面去父頁面表單元素的方法還沒研究,因為暫時沒用到,這種取值方式,感覺用不大到,因為你為什麼要在父頁面放值呢?如果真的需要,為何不直接放在子頁面中呢?

4、一般都是在父頁面裡面那子頁面的值,因為按鈕在父頁面,通過按鈕,走後臺,拿到一些值,可能會需要某一部分值來進行判斷或者操作,而這些值在子頁面。