分類
Javascript

動態寫入popup視窗內容

在利用瀏覽器發出提示訊息時, 可以利用 window.alert(‘message’); 的方式來進行, 但功能過於單調而能呈現的效果較少, 若是要呈現一些圖片或較多的訊息時, 可以利用 popup 視窗的方式(不過要注意快顯封鎖問題).

接下來我們來看一下如何利用 popup 視窗來動態產生訊息.

利用 window.open 開啟一個新的視窗, 利用傳回的視窗實體, 進行對該視窗的文件(document)開啟並進行寫入內文的動作. 整理測試的程式碼如下:

<script>
var popwin = window.open("", "", "top=10,left=10,width=250,height=250");
popwin.document.open();
popwin.document.write("this is a test text<br>");
popwin.document.write("this is second line<br>");
popwin.document.close();
</script>

其中特別要注意的是有關於最後的 close() 部分. 在 IE document open 未 close 的狀況並不會有任何顯示上的問題, 但是在 Firefox 裡會發生 progress bar 還在持續工作的進度, 如圖:

一旦下達 close() 後, 該 document 即關閉, Firefox 也就不會發生持續工作的狀態.

另外也要注意一點就是在 document.close() 之後, 再做 document.write() 時, 將會清除原來的內容, 再重新將文件寫入 write 的內容.

範例連結: http://sample.diary.tw/8/javascript.php

繼續閱讀:
Javascript Popup Image Window

發佈留言

發佈留言必須填寫的電子郵件地址不會公開。