熱點推薦:
您现在的位置: 電腦知識網 >> 編程 >> Java編程 >> JSP教程 >> 正文

解析jquery獲取父窗口的元素

2013-11-15 12:17:11  來源: JSP教程 

  ("#父窗口元素ID"windowparentdocument); 對應javascript版本為windowparentdocumentgetElementByIdx_x("父窗口元素ID")

取父窗口的元素方法$(selector windowparentdocument);
那麼你取父窗口的父窗口的元素就可以用$(selector windowparentparentdocument);
類似的取其它窗口的方法大同小異
$(selector windowtopdocument);
$(selector windowopenerdocument);
$(selector windowtopframes[]document);


子窗口創建及父窗口與子窗口之間通信

Javascript彈出子窗口
可以通過多種方式實現下面介紹幾種方法
() 通過window對象的open()方法open()方法將會產生一個新的window窗口對象
其用法為
windowopen(URLwindowNameparameters);
URL: 描述要打開的窗口的URL地址如何為空則不打開任何網頁
windowName:描述被打開的窗口的民稱可以使用_top_blank等內建名稱這裡的名稱跟<a href="" target="">裡的target屬性是一樣的
parameters:描述被打開的窗口的參數值或者說是樣貌其包括窗口的各個屬性值及要傳入的參數值
例如
打開一個 x 的干淨的窗口
open(_blankwidth=height=menubar=notoolbar=no
location=nodirectories=nostatus=noscrollbars=yesresizable=yes)
也可以這樣寫 var newWindow = open(_blank);

  參數說明如下
top=# 窗口頂部離開屏幕頂部的像素數
left=# 窗口左端離開屏幕左端的像素數
width=# 窗口的寬度
height=# 窗口的高度
menubar= 窗口有沒有菜單取值yes或no
toolbar= 窗口有沒有工具條取值yes或no
location= 窗口有沒有地址欄取值yes或no
directories= 窗口有沒有連接區取值yes或no
scrollbars= 窗口有沒有滾動條取值yes或no
status= 窗口有沒有狀態欄取值yes或no
resizable= 窗口給不給調整大小取值yes或no

  () 在javascript中除了通過open()方法建立window對象實現彈出窗口外還可以通過建立對話框的方式彈出窗口

alert(""); //彈出信息提示對話框
confirm(""); //彈出信息確認對話框
prompt(""); //具有交互性質的對話框
但是上述實現的彈出窗口具有的功能較為單一只能完成較為簡單的功能對於需要在對話框中顯示多個數據信息
甚至是HTML控件就無能為力了

  () 使用模態對話框實現復雜的對話框需求
在javascript的內建方法中還有一類方法可以實現通過對話框顯示HTML內容
也就是說可以通過創建對話框的方式來完成創建窗口對象所能完成的功能
包括創建模態對話框和非模態對話框兩種

  實現方法為
//創建模態你對話框
windowshowModalDialog(sURLvArgumentssFeatures)
//創建非模態對話框
windowshowModelessDialog(sURLvArgumentssFeatures)

  其區別在於
用showModelessDialog()打開窗口時不必用windowclose()去關閉它當以非模態方式[IE]打開時 打開對話框
的 窗口仍可以進行其他的操作即對話框不總是最上面的焦點當打開它的窗口URL改變時它自動關閉而模態[IE]方式的對話框始終有焦點(焦點不可移 走直到它關閉)模態對話框和打開它的窗口相聯系因此我們打開另外的窗口時他們的鏈接關系依然保存並且隱藏在活動窗口的下面 showModeDialog()則不然

  參數說明
sURL必選參數類型字符串
用來指定對話框要顯示的文檔的URL
vArguments可選參數類型變體
用來向對話框傳遞參數傳遞的參數類型不限包括數組等對話框通過windowdialogArguments來取得傳遞進來的參數
sFeatures選參數類型字符串
用來描述對話框的外觀等信息可以使用以下的一個或幾個用分號“;”隔開
dialogHeight對話框高度
不小於pxIE中dialogHeight和dialogWidth 默認的單位是em而IE中是px為方便其見在定義modal方式的對話框時用px做單位
dialogWidth: 對話框寬度
dialogLeft: 距離桌面左的距離
dialogTop: 離桌面上的距離
center: 窗口是否居中
默認yes但仍可以指定高度和寬度取值范圍{yes | no | | }
help: 是否顯示幫助按鈕
默認yes取值范圍 {yes | no | | }
resizable: 是否可被改變大小
默認no取值范圍 {yes | no | | } [IE+]
status: 是否顯示狀態欄
默認為yes[ Modeless]或no[Modal]
取值范圍{yes | no | | } [IE+]
scroll:指明對話框是否顯示滾動條
默認為yes取值范圍{ yes | no | | | on | off }
還有幾個屬性是用在HTA中的在一般的網頁中一般不使用
dialogHide:在打印或者打印預覽時對話框是否隱藏
默認為no取值范圍{ yes | no | | | on | off }
edge:指明對話框的邊框樣式
默認為raised取值范圍{ sunken | raised }
unadorned:默認為no取值范圍{ yes | no | | | on | off }

  傳入參數
要想對話框傳遞參數是通過vArguments來進行傳遞的類型不限制對於字符串類型最大為個字符也可以傳遞對象
例如
var newWin=windowshowModalDialog(urlwindowdialogHeight:px dialogLeft:px dialogTop:px
dialogWidth:px status: edge:sunken);
newWinopen();
與使用windowopen()方法創建窗口相比模態方法創建窗口的區別在於有模態方法創建的窗口後將不能操作父窗口
子窗口與父窗口間通信
() 使用windowopen()創建的窗口與父窗口通信
可以在子窗口頁面中通過windowopener來獲取父窗口對象獲取之後子窗口便可以對父窗口執行刷新傳值等操作

windowopenerlocationreload(); //子窗口刷新父窗口
windowopenerlocationhref //獲取父窗口href
windowopenerlocaitonpathname //獲取父窗口路徑名
//刷新父頁面
windowlocationhref=windowlocationhref ; //重新定位父頁面
windowlocationreload;
() 模態窗口與父窗口通信
通過使用showModelDialog()及showModelessDialog()方法創建的子窗口想與父窗口通信時不能通過windowopener
來獲取父窗口對象要實現通信必須在創建模態子窗口時向子窗口傳入父窗口對象
實現方式為
在父窗口中
var newWin=windowshowModelDialog(urlwindow);
newWinopen();
此時參數window即是父窗口對象
在子窗口中
需首先獲取父窗口對象然後才能使用父窗口對象由於父窗口對象是在創建
子窗口時通過傳入參數的方式傳入的因此在子窗口中也只能通過獲取窗口參數的方式獲取父窗口對象獲取方式如下
var parent=widnowdialogArguments
變量parent便是父窗口對象
例如
//通過子窗口提交父窗口中的表單form提交後執行查詢操作
var parent=windowdialogArguments;
parentdocumentformaction="QueryInforjsp";
parentsubmit();
//刷新父頁面
var parent=windowdialogArguments;
parentlocationreload();
//從子窗口傳值到父窗口
要實現在模態子窗口中傳值到父窗口需要使用windowreturnValue完成
實現方法如下
在子窗口中
//獲取父窗口某字段值對該值加一後返回父窗口
var parent=windowdialogArguments;
var x=parentdocuementgetElementById("age")value;
x=x+
//傳回x值
windowreturnValue=x;
在父窗口中
//獲取來自子窗口的值
var newWin=windowshowModelDialog(urlwindow);
if(newWin!=null)
documentgetElementByIdx_x("age")value=newWin;
//在子窗口中設置父窗口的值
在 子窗口中向父窗口中傳入值似乎沒有直接設置父窗口中的值來得明了直接設置父窗口中元素的值顯得要更靈活一些不過具體使用哪種方法要根據實際情況和已有 的實現方式而定因為如果使用了不切實際的方法不僅降低開發效率也降低了執行效率往往也會造成不優雅的實現方式和代碼風格
子窗口設置父窗口的值使用方法如下
子窗口中
var parent=windowdialogArguments;
var x=parentdocumentgetElementByIdx_x("age")value;
x=x+
//設置父窗口中age屬性值
parentdocumentgetElementByIdx_x("age")value=x;
以 上是我在項目中使用javascript解決子窗口問題時收集及積累的一些方法和資料我是使用建立模態窗口的方式來實現的(這主要與項目本身有關) 不過其實不論是使用windowopen()還是使用windowshowModelDialog()進行傳參等操作時雖然在實現方法上有很大的差 別初次接觸會覺得有點亂但只要理清子窗口與父窗口之間的關系和角色之後就很好理解了


From:http://tw.wingwit.com/Article/program/Java/JSP/201311/20651.html
    推薦文章
    Copyright © 2005-2013 電腦知識網 Computer Knowledge   All rights reserved.