超圖解系列圖書

Arduino+Python+JavaScript+程式設計+硬體DIY

Flash與ActionScript, 動態網頁製作, 教學文件

使用JavaScript程式操控瀏覽器視窗（二）

cubie

使用JavaScript程式操控瀏覽器視窗（二）
文∕趙英傑

延續上一篇文章，本文將說明：

  • 使用Flash的getURL()函數，執行網頁裡的JavaScript程式。
  • 外部程式的安全性問題

Flash影片的互動內容，歸ActionScript程式來管，瀏覽器（網頁內容）則歸JavaScript掌管（在IE瀏覽器上，還可以用微軟的VBScript程式控制，不過很少人用VBScript撰寫網頁互動程式）。

如果要從Flash影片當中開啟新的瀏覽器視窗，就必須借助於JavaScript。Flash裡面可以包含整個JavaScript程式，或者，JavaScript寫在網頁裡面，從Flash影片呼叫執行。

從Flash呼叫網頁JavaScript程式最簡易的方式，就是透過getURL超連結指令。一般的超連結指令都是採用http通訊協定，連結到指定的網路資源，例如，底下的ActionScript敘述將令瀏覽器開啟swf.com.tw的首頁：

getURL(“https://swf.com.tw”);

如果把通訊協定改成javascript，將透過Flash執行包含該Flash影片的網頁當中的JavaScript程式。其語法格式如下：

getURL(“javascript:程式敘述寫在這裡”);

以執行網頁上的函數為例，請先把上一篇文章介紹的開啟視窗敘述，改寫成函數，放在網頁的檔頭區（<head>和</head>標籤之間）：

<script  language="javascript">
 function openWindow(url, id, args) {
   window.open(url,id,  args);
 }
</script>

自訂函數稱為openWindow，它將接收三個分別代表「開啟網址（url）」、「視窗名稱（id）」及「其他參數（args）」的參數。在相同網頁上，透過超連結呼叫此函數的寫法如下：

<a href="https://swf.com.tw/"
   onClick="openWindow('https://swf.com.tw/', 
           'myWindow', 
           'width=400,height=200');
           return false;">
   在新視窗中開啟網頁
</a>

假設Flash影片舞台上包含一個叫做link_btn的按鈕實體，底下的關鍵影格程式（getURL敘述請寫成一行）將能開啟新的瀏覽器視窗（包含此Flash的網頁中，一定要有openWindow()自訂JavaScript函數，請參考本文的範例檔）：

link_btn.onRelease = function() {
 getURL("javascript:openWindow('https://swf.com.tw/',
 'myWindow',  'width=400,height=200');");
};

讀者也可以把整個JavaScript敘述包在Flash裡面，用getURL()敘述執行，例如（以下的getURL敘述請寫成一行）：

link_btn.onRelease = function() {
 getURL("javascript:window.open('https://swf.com.tw/',
 'myWindow', 'width=400,height=200');");
}

不過，當瀏覽器執行上述的JavaScript程式之後，將傳回新開啟視窗的參照，其類型為物件（object），所以主瀏覽器視窗將呈現[object]文字：

主瀏覽器視窗

取消window.open()敘述傳回新視窗參照的方式有兩種，其一是在window.open()的敘述前面，加上void關鍵字：

getURL("javascript:void 
      window.open('https://swf.com.tw/',
      'myWindow', 'width=400,height=200');");

或者，在window.open()敘述之後加上void(0)或void(false)：

getURL("javascript:window.open('https://swf.com.tw/',
       'myWindow',
       'width=400,height=200');void(0);");

外部程式的安全性問題

Flash 8的新安全限制，預設禁止本機的Flash 8影片執行網頁上的JavaScript程式。因此，當您在本機上執上面的範例程式時，瀏覽器將提出如下的警告：

安全性警告

解決這問題的方法之一，請按下對話方塊中的「設定」鈕，連結到Macromedia公司的播放器設定管理員網頁：

Flash Player 設定管理員

您可以點選中間的「永遠允許」，或者從右下角的彈出式選單選擇「新增」。管理員將會在底下的欄位提示您嘗試存取網頁的swf影片。請複製該字串，貼入上面的欄位（或者按下「瀏覽資料夾」鈕瀏覽到該檔所在的資料夾，允許該目錄的所有swf檔執行JavaScript）：

Flash Player 設定管理員

下圖是按下「確認」按鈕之後的結果：

Flash Player 設定管理員

設定完畢後，請關閉此瀏覽器視窗，再重新開啟或重新整理剛才的JavaScript網頁，即可順利從Flash開啟新視窗。

請按此下載本文的範例檔。

Website https://swf.com.tw
Posts created 497

47 thoughts on “使用JavaScript程式操控瀏覽器視窗（二）”

  3. 老師您好，若我想讓彈跳式視窗出現在螢幕正中央的位置，該怎麼寫程式呢？麻請老師撥空回答～謝謝:roll:

    回覆

  4. hi ycl:

    JavaScript能透過screen物件取得用戶端的螢幕資訊。如：screen.width將傳回螢幕寬度、screen.height能傳回螢幕高度；window.open()也具有left和top參數，用來設定新開啟視窗的左、上角座標位置，因此，底下改寫後的openWindow()函數（請留意，呼叫此函數時要傳入4個參數，後兩個分別代表視窗的寬與高）可以完成你的需求：

    function openWindow(url, id, w, h) {
    // 依照新視窗的寬與高，求取其位在螢幕上的中間位置。
    var wLeft = (screen.width – w) / 2;
    var wTop = (screen.height – h) / 2;
    window.open(url, id,
    ‘width=’ + w + ‘, height=’ + h + ‘, ‘ +
    ‘left=’ + wLeft + ‘, top=’ + wTop );
    }

    回覆

  5. 謝謝老師的詳細回答，但還有一點不懂的是：這個程式碼是要貼在link_btn裡面，還是輸出的html呢？小的才疏學淺，試不出來……

    回覆

  6. 上面的自訂函數放在網頁的檔頭區之間（請把 [ 和 ] 替換成 < 和 >）：

    [head]
    ：
    [script language=”javascript”]
    // 自訂的JavaScript函數放在這裡
    [/script]
    [/head]

    以超連結觸發此自訂函數為例，寫成：

    [a href=”https://swf.com.tw/”
    onClick=”openWindow(‘https://swf.com.tw/’,
    ‘myWindow’,
    400,200);
    return false;”]
    在新視窗中開啟網頁
    [/a]

    回覆

  8. 請教老師一下：
    如果把這種的 swf 檔案燒到光碟，光碟片要備份好幾份後給不同的客戶，這種安全性的問題可以解決嗎？也就是說有辦法直接點了swf檔案後(且不轉成 EXE 擋或不轉出為 flash 6 之前的舊版本)，不要再跑到設定管理員那做安全性設定嗎？

    回覆

  10. 老師您好,目前遇到一個flash與ajax結合的問題,很頭痛
    flash裡的button是利用getURL開啟一份B.html嵌入到原的A.html裡(B.html是利用ajax嵌入),B.html裡又會嵌入另一份C.html到A.html的某個錨點,
    問題出現在,點選有錨點的網頁後,再點flash的連結就失效了,整個會變成空白頁而沒有將B.html嵌入,是否應該在getURL裡設定嵌入B.html時,同時開啟一個連結至self呢?
    原寫法是on (release) { getURL(“javascript:includeHTML(‘../B.html’)”); },我該把開啟一個無作用的連結至self寫在什麼地方呢? 感激不盡!

    回覆

  12. 不好意思,今天才看到回應,網站內容不是我做的,我也不在這家公司上班,純粹只是幫朋友…謝謝您~
    http://www.kusophone.com.tw/00_Temp/index.asp
    例如點了左邊笑話系列,然後會出現內容在右邊,點內容的各項次… 點完之後再回去點左邊的選單…重複相同動作2~3次,再點左邊的選單就會出現空白頁
    這…該怎麼解決呢?

    回覆

  14. 不好意思,因為我是用ie測,跑起來就會出現空白頁的情況,就是在網址後會接#top,而flash似乎把它當成是新的頁面,而出現空白頁….

    回覆

  15. 如果是特定瀏覽器會發生錯誤的情況，那應該跟Flash無關，可能要檢查一下AJAX部分（JavaScript）程式碼。

    good luck!
    jeffrey

    回覆

  18. if (_root.arrayHave.length == 2)
    {
    getURL(“javascript:countPTag(30011,14,28);ShopcarMassAdd(\'” + _root.arrayHave[0] + “\’,\'” + _root.arrayHave[1] + “\’);”, “”);
    }
    end if

    (“javascript:countPTag(30011,14,28);这个是什么意思,能指教一下吗?

    回覆

  20. 設定安全性的問題!
    因為它設定時必須有檔案的路徑!如過路徑更改了.他就無法允許.又得另外設定

    是否有辦法可以讓他在任何情況下(任何路徑)都可以允許開啟網頁呢?

    回覆

  22. 老師您好:
    請問flash呼叫Javascript開啟固定視窗是否一定要上傳到伺服器才能正常執行?
    為何在電腦本地端無法執行?
    謝謝老師

    回覆

  23. hi boka:

    Flash Player的安全性限制，預設無法在本地端呼叫執行JavaScript程式，不過只要調整一下安全性設定即可。

    jeffrey

    回覆

  24. 老師~謝謝你!!
    我研究了一整天固定視窗的問題
    也看了很多篇別人的教法
    你這篇最棒了很詳細!!我的flash可以運作了^^
    謝謝你!!哇出溫啊~~

    回覆

  27. 老師您好!
    我有個問題想要請教您,我幫公司寫網頁,並且有製作彈跳視窗,
    但我不了解的是為什麼別家公司的彈跳視窗的網址列上都不會出現一些其他
    亂碼字出現,而我的卻會,想請老師幫我解決
    http://www.ebell.com.tw 這是我上班公司的網址

    回覆

  28. 如果妳指的亂碼是像 %A4%A4%A4%E5 這樣的文字，那是正常的。如果傳送的資料包含中文，網址列就會呈現經過URL編碼的內容。

    回覆

  30. 那個數字是「影像地圖（image map）」的座標值，跟彈出視窗沒關係。只要把 < img > 標籤裡的 ismap=”ismap” 屬性刪除即可。

    回覆

  33. 你說Flash8 會彈出安全性警告，但如果你把這個網頁和flash都上傳到網頁寄存空間的話，便不會發生以上的情況了。:grin:

    回覆

  34. 謝謝你告訴我這個「常識」。
    安全性警告本來就是針對本機執行的.swf而設的，開啟遠端網站裡的.swf當然沒問題。

    回覆

  35. 可不可以寫個function，然後再從flash呼叫出來？:???:
    例︰
    getURL(“javascript:function123()”);

    回覆

  36. 可以，但目前已經不建議使用getURL()呼叫JavaScript（AS 3.0也不支援getURL），應該使用ExternalInterface，例如：

    ExternalInterface.call(“函數名稱”,” 參數1″, “參數2”, …);

    回覆

  37. 老師超感謝您的熱心:lol:
    我剛學會用flash製作部落格小物,使用的是flash cs3.指令是
    on (press){getURL(“http://tw.myblog.yahoo.com/mm-18m”,_blank);}

    想把小物連結到我的雅虎部落格(swf上傳空間是樂多,單純點進網址是可以連結的)
    使用這語法卻無法連結到我網站,不知哪裡出了問題?

    請老師幫幫我好嗎!!:oops:

    回覆

  38. 程式的主要問題是，_blank參數前後要用引號刮起來，像這樣：

    on (release) {
    getURL(“http://tw.myblog.yahoo.com/mm-18m”, “_blank”);
    }

    回覆

  40. 老師好～不好意思又來請教您:oops:
    如果要去掉程式裡的秒數跟分後面的兩點要如何寫呢？感謝您！！

    nowDate = new Date();
    date1 = nowDate.getYear()+1900;
    date3 = nowDate.getDate();
    myDate = new Date();
    myDate = myDate.getMonth();
    dateArray = new Array(“1”, “2”, “3”, “4”, “5”, “6”, “7”, “8”, “9”, “10”, “11”, “12”);
    date2 = dateArray[mydate];
    ymd = date1+”/”+date2+”/”+date3;
    nowDate = new Date();
    hour = nowDate.getHours();
    if (hour>24) {
    if (hour

    回覆

  42. nowDate.getMinutes()
    和
    nowDate.getSeconds()

    可分別取得分鐘和秒數，兩者中間要接或者不接什麼符號都隨便你。

    回覆

  43. ｃｕｂｉｅ老師人真好您是我的恩人很感激您:razz:
    又如果要製作外國時間的時計要怎麼改（時鐘跟電子式的）:oops:

    回覆

  44. hi joy:

    網路上已經有許多現成的世界時鐘程式，請自行搜尋 JavaScript World Time。

    have fun!
    jeffrey

    回覆

  46. 老師我想請教一下
    我在Flash的內部連結網頁遇到非常大的挫折
    據我在網路上的爬文
    on (release) {
    getURL(“我的網頁檔.html”);
    }
    網頁檔也和flash檔 放在同一個資料夾中
    但只要我匯出成swf檔按按鈕 連到的內部網頁卻是無法顯示
    這是為何呢? 我也有看過有人說Action Script 2.0中的getURL()指令已失效
    我使用的是cs6 正好也是Action Script 2.0 請問是這原因嗎~要如何解決ㄋ?

    回覆

發佈留言

發佈留言必須填寫的電子郵件地址不會公開。 必填欄位標示為 *

Anti-spam protection

發表回應之前，請先輸入下列四個紅色英文字母：



Protected by Gab Captcha 2

Related Posts

Begin typing your search term above and press enter to search. Press ESC to cancel.

Back To Top