JavaScript模式窗口的使用方法.doc

模式窗口的用法一、問題： 我想彈出一個窗口，然後在彈出的窗口裡，選擇或輸入一些信息，要求這些信息返回到父頁面。建立父頁面：a.htm 建立子頁面：b.htm 姓名： 年齡： 這裡利用了模式窗口window.showModalDialog(),利用window.returnValue = window.showModalDialog(sURL , vArguments , sFeatures)，我們可以打開一個模態窗口，該窗口的優點是限制用戶只能對當前的頁面進行操作，而對其父頁面不能進行操作，常用於嚮導或者信息獲取頁面。利用其中的vArguments我們可以在父頁面和彈出的頁面中進行參數的傳遞，參數可以為自定義的對象，也可以傳遞父頁面中任何一個控件的引用，這使得我們可以很容易的來操作父頁面中的各個元素，使得參數的傳遞變得非常容易。二、第個參數的討論showModalDialog(子頁面地址,向子頁面傳遞參數,子頁面外觀設置)，關於參數的詳細設置看最後的註釋，這裡主要研究下第個參數。1.第個參數為自定義對像我們可以定義一個javascript對象，然後定義各種自定義屬性的值，然後可以將此對像傳遞到子頁面中。例：將父頁面的信息封裝成一個對象，然後將該對像傳遞給子頁面。父頁面：oneParent.htm 父頁面向子頁面傳遞自定義對像參數 姓名： 年齡： 子頁面：oneSon.htm 姓名： 年齡： 以上代碼中，文檔全部加載完,才執行window.onload指定函數，以找到document.forms0.txtName對象，如果去掉，window.onload=function()直接寫大括號裡的代碼，則必須把這個代碼塊房到之後才能正確運行，否則出現運行時間錯誤，找不到document.forms0.txtName對像2.第個參數是父頁面的一個元素我們可以將父頁面中元素對象的引用傳遞給子頁面，通過該引用我們可以訪問父頁面中的該元素對象。例：其中利用元素對象的引用我們可以操縱父頁面的元素對象的屬性。父頁面：twoParent.htm 父頁面向子頁面傳遞父頁面元素 姓名： 年齡： 子頁面：twoSon.htm 這裡註釋掉window.onload=function()，直接寫大括號裡的代碼，目的讓JS代碼先加載，後加載裡的元素，否則出現找不到對像infoKeYi的錯誤。.第個參數是window.如果第個參數是window,這樣可以取得父窗口的一些數據和方法。如：/取得父窗口的JS變量 varwindow.dialogArguments.父窗口中的變量;/獲得父窗口的對象和屬性window.dialogArguments.form1.父窗口中控件name.value ;/調用父窗口的方法 funwindow.dialogArguments.父窗口中的方法 ;父頁面：threeParent.htm 父頁面向子頁面傳遞父頁面元素 姓名： 子頁面：threeSon.htm 姓名： 年齡： 問候： 三、註釋：1、window.open()參數：例如： 參數解釋： js腳本開始； window.open 彈出新窗口的命令； page.html 彈出窗口的文件名； newwindow 彈出窗口的名字（不是文件名），非必須，可用空代替； height=100 窗口高度； width=400 窗口寬度； top=0 窗口距離屏幕上方的象素值； left=0 窗口距離屏幕左側的象素值； toolbar=no 是否顯示工具欄，yes為顯示； menubar，scrollbars 表示菜單欄和滾動欄。 resizable=no 是否允許改變窗口大小，yes為允許； location=no 是否顯示地址欄，yes為允許； status=no 是否顯示狀態欄內的信息（通常是文件已經打開），yes為允許；2、window.showModalDialog()參數：vReturnValuewindow.showModalDialog(sURL , vArguments ,sFeatures) 例如：/SCRIPT參數說明： sURL- 必選參數，類型：字符串。用來指定對話框要顯示的文檔的URL。 vArguments- 可選參數，類型：變體。用來向對話框傳遞參數。傳遞的參數類型不限，包括數組等。對話框通過window.dialogArguments來取得傳遞進來的參數。 sFeatures- 可選參數，類型：字符串。用來描述對話框的外觀等信息，可以使用以下的一個或幾個，用分號;隔開。 1.dialogHeight :對話框高度，不小於px，中dialogHeight 和 dialogWidth 默認的單位是em，而中是px，為方便其見，在定義modal方式的對話框時，用px做單位。 2.dialogWidth: 對話框寬度。 3.dialogLeft: 離屏幕左的距離。 4.dialogTop: 離屏幕上的距離。 5.center: yesno10：窗口是否居中，默認yes，但仍可以指定高度和寬度。 6.help: yesno10：是否顯示幫助按鈕，默認yes。 7.resizable: yesno10 ：是否可被改變大小。默認no。 8.status: yesno10 IE5+：是否顯示狀態欄。默認為yes Modeless或noModal。 9.scroll: yesno10onoff：指明對話框是否顯示滾動條。默認為yes。 下面幾個屬性是用在HTA中的，在一般的網頁中一般不使用。 10.dialo