設為首頁收藏本站

 取回密碼
 註冊
搜尋
熱搜: Redump discuz
檢視: 254|回覆: 4

【轉貼】 FAQ 問答集 - JavaScript

[複製連結]
發表於 2002年4月14日 22:02:32 | 顯示全部內容 |閱讀模式
  
FAQ 問答集 - JavaScript



索引:

如何計算兩個日期之間的天數? 1998-09-27
如何傳遞一個字串或數值到另一個網頁? 1999-10-22
如何在頁面上顯示該檔最後編修的日期(Last Modified Date)? 1998-09-27
FORM 表單中的 OPTION 項目值要如何取得? 1998-09-27
FORM 表單中的 RADIO 項目值要如何取得? 1998-09-27
FORM 表單中的 CHECKBOX 項目值要如何取得? 1998-09-27
一個使用 CGI 運作的 FORM 表單頁面,要如何才能在 CGI Server 故障時仍可將資料改由信件方式寄出? 1998-09-27
如何在新開啟的 POPUP 子視窗中傳遞一個字串或數值給原先開啟該視窗的母視窗頁面? 1998-09-27
我可以在 FRAME1 頁面上點選按鈕項目後,去執行 FRAME2 頁面上的 Function 嗎? 1998-09-27
要如何才能檢查參觀者使用的瀏覽器是否支援 JavaScript? 1998-09-27
參觀者瀏覽器所支援的 JavaScript 版本要如何取得? 1998-09-27
要如何做才能在頁面載入完畢後,自動的將游標移到 FORM 表單中指定的輸入欄位中? 1998-09-27
如何才能在按下 FORM 表單的 BUTTON 按鈕項目後,在指定的 FRAME 分割區載入其它的頁面檔? 1998-09-27
如何在 FORM 表單的 SUBMIT 按鈕被點選時,先做指定的檢查,以決定是否要送出表單? 1998-09-27
如何使用圖檔來代替 FORM 表單中的 SUBMIT 按鈕項? 1998-09-27
如何可以在送出 FORM 表單後,載入指定的頁面檔? 1998-09-27
如何才能使用兩個 SUBMIT 按鈕項來使同一個 FORM 做不同的動作? 1998-09-27
如何做出一個下拉式的選單,並且在點選項目後可以在指定的分割區顯示頁面資料? 1998-09-27
如何才能使得 FOCUS 指向其它 FRAME 載入的網頁之上? 1998-09-27
如何讓自己的首頁被連結時,不會被框在別人網頁的 FRAME 內? 1998-09-27
如何在 POPUP 的視窗上放置關閉該視窗的項目? 1998-09-27
如何才能在網頁上撥放音樂檔案,並且可以控制音樂檔的撥放與停止? 1998-10-14
我希望在網頁被載入時能隨機撥放不同的音樂檔,應該怎麼作? 1999-02-05
如何在瀏覽器的狀態行顯示訊息? 1998-11-15
在參觀者載入首頁時要如何顯示一個歡迎視窗呢? 1998-11-19
如何才能讓自己網頁所開啟的突顯式視窗一直保持在最上層顯示,直到關閉為止? 1998-11-29
如何設定滑鼠移入及移開超連結時顯示不同的圖檔? 1999-08-03
不同時間顯示不同訊息的能要如何製作? 1999-03-29
如何處理訪客停留參觀網頁時間的顯示? 1999-03-31
Netscape 瀏覽器在調整視窗大小時,以 JavaScript 處理顯示的畫面會亂掉,應如何解決? 1999-04-23
如何在參觀者離開我的網頁時顯示一個訊息視窗? 1999-06-15
不同瀏覽器以及版本應該如何識別? 1999-07-13
如何才能避免被他人窺視網頁的內部設定與敘述? 1999-07-30
如何才能避免被他人在未經告知的情形下對某些特定頁面作了局部的連結? 1999-07-30
訪客使用的環境要如何偵測? 1999-08-03
我的首頁採分割式版面,左方為選單右方為公告,如何在右側頁面未完全載入前禁止點選左側選項? 1999-08-08
如何才能在點選 SUBMIT 按鈕時能同時送出多個表單? 1999-08-09
如何才能讓使用 IE 及 NN 的訪客分別載入不同的首頁? 1999-08-19
如何才能動態的顯示文字資料於 FORM 以外的物件上? 1999-09-05
播放音樂的點唱機要如何製作? 1999-09-12
如何製作一個詢問視窗並依據訪客的選擇作不同的處理? 1999-09-12
如何檢查 FORM 的 TEXT 欄位輸入的資料是否為數字? 1999-10-09
如何才能正確的取得 4 位數的西曆年份? 1999-10-17
動態的階層展開式選單怎麼製作? 2000-03-17
如何使用 open() 函數開啟全畫面的視窗? 2000-03-11
如何使用 open() 函數指定載入檔案的視窗? 2000-08-21
如何在不同的頁面中存取變數資料? 2001-02-23

--------------------------------------------------------------------------------

如何在不同的頁面中存取變數資料?
(Feb. 23, 2001)
無論是在不同的 FRAME 或是 WINDOW,只要您能取得頁面視窗的名稱,就可以對該視窗的頁面資料作存取的動作,例如以 open() 函數開啟的 POPUP 新視窗中,可以使用 opener 來聯繫母視窗,以 FRAMESET 分隔的視窗,則以 FRAME 名稱為名,您可以參考本頁面上其它相關項目或 HTML 及 JavaScript 使用文件上的說明。
我在這裡寫一個存取不同分割版面變數的簡單範例 (簡化敘述,其餘的相關宣告與標籤敘述請自行補齊) 供大家參考一下:


版面配置檔設定如下:
<frameset rows="50%,*" border=0>
<frame src="TOPX.htm" name="TOP_FRAME">
<frame src="BOTTOMX.htm" name="BOTTOM_FRAME">
</frameset>

TOP_FRAME 視窗內的 TOPX.htm 檔案設置一段 JavaScript 宣告然後設定一個變數如下:
var top_var=1;
另外在 BODY 段放置一段 HTML 敘述如下:
<FORM>
<INPUT TYPE=BUTTON onClick="top_var++;alert(top_var)" value="本頁變數累加">
</FORM>

以上標籤敘述可以產生一個按鈕項目,點選後會將 top_var 變數累加 1 之後以提示視窗顯示出來。


BOTTOM_FRAME 視窗內的 BOTTOMX.htm 檔案內容如下:
<FORM>
<INPUT TYPE=BUTTON onClick="alert(parent.TOP_FRAME.top_var)" value="讀取它頁變數">
</FORM>
以上標籤敘述可以產生一個按鈕項目,點選後會將 TOP_FRAME 分割視窗內的 top_var 變數值以提示視窗顯示出來。


如何使用 open() 函數指定載入檔案的視窗?
(Aug. 21, 2000)
使用 open() 函數有釵h可設定的參數,其中最重要的兩個參數,一個是指定欲載入的「網頁檔案位址與名稱」,另一個則是指定載入檔案的「視窗名稱」,網頁檔案的位址與名稱與超連結內的網址敘述是相同的,應該不難瞭解,而視窗名稱其實也就像是超連結標籤內的 TARGET 參數是一樣的,如果您設定的視窗名稱是目前瀏覽器上已經存在的視窗,那麼指定的網頁檔案就會載入並顯示於那個現存的視窗中,否則的話將會開啟一個新的視窗來作載入及顯示的動作,例如:
前邊已經講到「視窗名稱」這個參數與超連結標籤的 TARGET 參數作用相同,而 TARGET 尚有數個系統預設的參數可使用,這也是可以套用在「視窗名稱」這個參數理使用的,這些預設參數簡單說明如下:
_blank 連結將開啟一個新的空白瀏覽視窗(未分割的完整視窗)。

_self 連結將使用本連結指令所屬頁面所在之瀏覽視窗(或分割的子視窗)。

_parent 連結啟用 FRAMESET 的 parent (前一層)視窗,若 FRAMESET 無 parent,則本參數作用與 _self 參數相同。

_top 連結啟用整個的瀏覽視窗(最上層),不會受限於 FRAMESET 的視窗分割設定。

假設 index.htm 為版面配置檔,將畫面分割為左右兩個部分,而主要設定內容如下:
<frameset cols="120,*" border=0>
<frame src="menu.htm" name="leftWin" NORESIZE>
<frame src="data.htm" name="mainWin" NORESIZE>
</frameset>

在左方(leftWin)分割的 menu.htm 檔中所設的連結項目都希望顯示於右方(mainWin)的分割區域內,則設定的連結項目中應設定如下:
windows.open("page1.htm", "mainWin&quothttps://www.fishman.idv.tw/phpforum/thread-1837-1-1.html;
但是如果是想要另開新視窗來載入 page1.htm 這個網頁檔案的話,那就設定視窗名稱這個參數為「現在並不存在於瀏覽版面上的視窗名稱」或者是第一項所提到的 _blank 參數即可:
windows.open("page1.htm", "myNewWin&quothttps://www.fishman.idv.tw/phpforum/thread-1837-1-1.html;
或者是:
windows.open("page1.htm", "_blank&quothttps://www.fishman.idv.tw/phpforum/thread-1837-1-1.html;


如何使用 open() 函數開啟全畫面的視窗?
(Mar. 11, 2000)
在留言板上有網友問及如標題所示的問題,我覺得這個問題可能會有其他的網友也感興趣,因此花了一點時間將這個問題的參考資料寫在這裡,以便供大家來參考。
基本上 JavaScript 有一些函數可以取得與畫面及視窗的一些相關資訊,我們可以利用這種方式來取得畫面的高與寬,然後以取得的高與寬數據來設定開啟的視窗即可:

var width=screen.width;
var height=screen.height;
if(document.all)
  windows.open('網頁位址','視窗名稱','width='+width+',height='+height+',left=0,top=0,scrollbars=1')
else
  windows.open('網頁位址','視窗名稱','width='+width+',height='+height+',screenX=0,screenY=0')



註:IE 必須加上 scrollbars=1 這個參數才能捲動頁面內容。


--------------------------------------------------------------------------------
除上述的方法之外,IE 的 open() 函數還有一項特異能,它提供了一個簡易的參數 fullscreen 可以做這樣的動作,只要該參數給予 1 或 yes 就可以直接設成全畫面的顯示模式啦~
var width=screen.width;
var height=screen.height;
if(document.all)
  mW=windows.open('網頁位址','視窗名稱','fullscreen=1')
else
  mW=windows.open('網頁位址','視窗名稱','width='+width+',height='+height+',screenX=0,screenY=0')

(僅 IE 適用)


動態的階層展開式選單怎麼製作?
(Mar. 17, 2000)
有不少網友對網頁上使用動態的階層展開式選單很有興趣,他們希望能在滑鼠指標移到某個選項時,能自動展開該項的次選項出來,就像是 Windows 系統的選單一樣,其實這類的選單早就有釵h在網路上流傳了,而且也都寫得非常好,同時也都提供了詳細的製作步驟和原始碼讓網友參考,我並不想再另外寫一個出來,因此我將我所知道有類似資訊的幾個網址列出如下,這些網址所展示的動態選單都是同時支援 IE 及 NN 的,有興趣的網友請自行前往參考:
The JavaScript Menu Component
Hierarchical Menus: Version 3
Navigation Bar
Pop-Up DHTML Navigational System (網友小群提供)


如何才能正確的取得 4 位數的西曆年份?
(Jan. 10, 2000)
日前網友 Lilyandy 寫信和我討論如何將本網頁寫的 SatyTime (訪客停留時間) 所顯示的日期的西曆年份由兩位數改為四位數來顯示,以便因應 Y2K 的來臨,我們在交換意見的過程中,無意中卻發現如果以下幾個現象:
直接以 getYear() 函數取得的是兩位數的年份資料,例如 1999 年將會是 99 這個數字。
將上述取得的值加上 1900 後可以修正成四位數的正確年份。
如果將電腦的系統時間調到西元 2000 年,以前述方式所修正取得的年份將會變成 2000 + 1900 = 3900。
由上述現象可以知道 JavaScript 在系統時間為西元 2000 年之前是以兩位數來處理年份資料的,但是到了西元 2000 年之後就改為四位數來處理了,有鑑於此,我就將由 getYear() 函數取得的年份資料先作一個檢查,若是小於 1900 時才加上 1900,反之則否,我已經將 StayTime 作了修改,其中與本篇有關的部分我也節錄如下供大家參考:
// 假設 yy 為放置西曆年份資料的變數
var yy = now.getYear();
// 若 yy 大於 1900 則加上 0 (等於原值),否則就加上 1900
yy = yy + (yy > 1900 ? 0 : 1900);

這個動作簡單吧?但是若一個沒留意就會被搞得迷迷糊糊的,為了節省您的時間 (或者說提醒您),如果您撰寫的 JavaScript 程式是僅僅以 getYear() 所取得的年份資料加上 1900 來處理的話,您就趕緊修正一下吧,否則一到西元 2000 年時,您就變成 "回到未來" 的人囉~

上文於 1999 年 10 月 17 日完成撰寫,而昨日(2000/01/09)收到署名為 "黎國豪" 的網友來信,告知可使用 getFullYear() 這個函數來取代 getYear() 這個函數取得正確的四位數年份,各位網友們也可以一併參考,該函數係 1.3 版 JavaScript 新增的,因此使用時得確定您的瀏覽器有支援 1.3 版以上的 JavaScript 才可以正常運作喔~


如何檢查 FORM 的 TEXT 欄位輸入的資料是否為數字?
(Oct. 09, 1999)
要達到檢查資料是否為數字的方法應該不只一種,我在此提供一種很簡單也很有效的方法,這個方法可以寫成一個自訂函數,以便簡化程式的敘述,使用時可以將要檢查的資料當作參數傳給該函數,當函數檢查該資料是屬於數字的話就傳回 true 的值,否則將傳回 false 值:
JavaScript 自訂函數:
function isNum(chkStr){
  var cmp="0123456789";
  var rc=true;
  var cmpChar;

  for(var i=0; i<chkStr.length; i++){
     cmpChar=chkStr.substring(i,i+1)
     if(cmp.indexOf(cmpChar)<0){
       rc=false;
       i=chkStr.length;
     }
  }
  return rc;
}

function chkNum(nn){
  var cfield=eval('document.MYFORM.'+nn);
  var rc=isNum(cfield.value);
  if(!rc){
    alert("'金額' 欄位僅可輸入數字!&quothttps://www.fishman.idv.tw/phpforum/thread-1837-1-1.html;
    cfield.focus();
  }
  return rc;
}

HTML 使用範例:
<FORM NAME=MYFORM>
金額:<INPUT TYPE=TEXT NAME=MONEY onBlur="return chkNum('MONEY')"><BR>
姓名:<INPUT TYPE=TEXT NAME=NAME>
</FORM>

上述的範例會在您輸入 MONEY 這個欄位的資料後,將滑鼠游標移到 NAME 欄時作資料的檢查,若是輸入的資料為數字,那麼就可以將滑鼠游標移到 NAME 欄內,否則將會一直保持在 MONEY 欄位內,原本我使用 IE 時,僅需直接以 onChange 套用 this.value 給 isNum() 函數就可以了,但是 NN 執行的結果不盡理想,因此改為現在使用 onBlur 事件,並多透過一個 chkNum() 函數的方式來處理。


如何製作一個詢問視窗並依據訪客的選擇作不同的處理?
(Sep. 12, 1999)
這是一個指令的問題而不是技巧的問題,因此在此不多作解說,僅將一個簡單的 confirm() 用法列示如下,想作進一步瞭解者請自行查看 JavaScript 的指令說明文件:
if(confirm("欲詢問的訊息字樣&quothttps://www.fishman.idv.tw/phpforum/thread-1837-1-1.html){
  ...選擇 "確定" 的後續執行敘述
}else{
  ...選擇 "取消" 的後續執行敘述
}


播放音樂的點唱機要如何製作?
(Sep. 12, 1999)
點唱機的動作有幾個要點,一是要能選擇音樂或歌曲、二是要有按鈕能中止及重新播放音樂、三是不能隨著頁面的更換而中止掉音樂的播放,要達到前述的要求就產生了幾個重點:一是為了避免音樂的播放在瀏覽不同頁面時被中止掉,所以必須使用版面分割檔來配置,二是要使用一個假的音樂檔來作為停止播放音樂的觸發動作,因為以現有的方式(使用 stop 函數)似乎有時會不靈光。
本頁已經有播放及中止音樂的範例及說明了,在這裡我另外提供一個範例,還是老話一句:我盡量簡化程式的內容,因此畫面並不多作美化的處理,您可以自行修改畫面以符合您的需求。

請點選此處查看範例。


如何才能動態的顯示文字資料於 FORM 以外的物件上?
(Sep. 05, 1999)
通常我們顯示時間....等的動態文字資料都是放在 FORM 的 TEXT 或是 BUTTON 物件上,但是這樣的顯示效果通常比較不好看,早期的瀏覽器又無法將文字資料動態的顯示於其他的物件上,直到 IE 及 NN 第四版之後,才有了其它的選擇,我已經將這樣的動作加到 "Stay Time" 這支 JavaScript 程式裡去了,您若是對這樣的動作感到興趣的話,可以去參考一下,作者在這裡不重複累述佔用過多的篇幅!  

如何才能讓使用 IE 及 NN 的訪客分別載入不同的首頁?
(Aug. 19, 1999)
當網友JASON問我這個問題時我有點納悶,我記得這個問題不是有整理了嗎?但是我查看了本篇 FAQ 之後,才發現並未直接寫成範例,而是只有寫到如何判別瀏覽器的種類而已,所以我趕緊將這個自己以為早就寫好的範例補上來,以便爾後有其他網友想了解時能有一個參考。
會作這個動作的頁面通常是在首頁,當訪客連結到您的首頁時,即自動的判斷訪客使用的瀏覽器種類然後分別載入不同的頁面,因此我們必須在首頁檔作如下的判斷與處理:

不作版面分割時:
var NN4  = (document.layers) ? true : false;
var IE4  = (document.all) ? true : false;
if(IE4){
  location.href="IE_Page.htm";
}else if(NN4){
  location.href="NN_Page.htm";
}else{
  location.href="OTHER_Page.htm";
}

作版面分割時:
var NN4 = (document.layers) ? true : false;
var IE4 = (document.all) ? true : false;
var PMENU, PDATA;
if(IE4){
  PMENU="IE_Menu.htm";
  PDATA="IE_Page.htm";
}else if(NN4){
  PMENU="NN_Menu.htm";
  PDATA="NN_Page.htm";
}else{
  PMENU="OTHER_Menu.htm";
  PDATA="OTHER_Page.htm";
}

documents.writeln('<frameset cols="120,*" border=0>');
  documents.writeln('<frame src="'+PMENU+'" name="menu">');
  documents.writeln('<frame src="'+PDATA+'" name="data">');
documents.write('</frameset>');

上述僅以簡例供您作一參考,如果您有更複雜的版面分割,請自行斟酌調整上述的設定。


如何才能在點選 SUBMIT 按鈕時能同時送出多個表單?
(Aug. 09, 1999)
這個動作是網友SATURN向我詢問的,他原先是想只觸發一個留言版的送出鈕,就可以送出留言到兩個不同的留言板上,而他也認為若是可以用一個傳送鈕傳送多個表單的話,就可以製造出在一個設置了數個搜尋引擎的分割頁面,而使用者只需輸入一個關鍵字並按下送出鈕,就可以驅動所有的搜尋引擎同時進行搜尋,而不是逐個頁面輸入關鍵字然後逐個按鈕送出。
要達到這樣的目的有兩個動作必須要處理,一個是將輸入的資料複製給其它頁面,另一個則是觸發各個頁面的表單送出,以下敘述已經過網友 SATURN 的測試無誤,因此將其列出來供您參考:

在主要的輸入頁面中設置如下:
JavaScript 部分:
function sendform(){
  // 將 GB1 的 data 欄位資料複製給 GB2 的 comments 欄位
  parent.frames['othersite'].document.GB2.data.value=document.GB1.comments.value;
  // 執行 GB1 的 submit 能送出 GB1 表單
  document.GB1.submit();
  // 執行 GB2 的 submit 能送出 GB2 表單
  parent.frames['othersite'].document.GB2.submit();
}

HTML 表單部分:
<FORM NAME="GB1" ACTION="https://your.site.com/cgi-bin/gb1.pl" METHOD="POST">
<TEXTAREA name=comments COLS=60 ROWS=4></TEXTAREA>
(以下的 SUBMIT 按鈕設定成按下後去執行 sendform() 這個程序)
<INPUT TYPE=SUBMIT value="送出留言" onClick="sendform();return true">
</FORM>

在其它的頁面的 HTML 表單中設定如下:
(假設本分割版面命名為 othersite)
<FORM NAME="GB2" ACTION="https://other.site.com/cgi-bin/gb2.pl" METHOD="POST">
<TEXTAREA name=data COLS=60 ROWS=4></TEXTAREA>
</FORM>

以上範例以送出留言資料到兩個留言板為例,所以使用了 TEXTAREA 的欄位,您可以視個別的需要改成 TEXT 或其它的種類,並且增加其它必要的欄位。

當然您可以視個人的需要來決定其它的分割頁面是否要顯示出來,如果要作送出留言資料到兩個留言板上,那就沒有必要將第二個版面顯示出來,但是如果是要作成觸發多個搜索引擎並顯示搜尋結果的話,當然就必須要顯示出來囉!


我的首頁採分割式版面,左方為選單右方為公告,如何在右側頁面未完全載入前禁止點選左側選項?
(Aug. 08, 1999)
網友克萊兒之所以會問我這個問題,是因為她的版面是設成左方為選單、而右方為內容區,因為內容區的資料通常比較大,當該頁尚未完全載入時,若是訪客點選了選單上的連結項目的話,瀏覽器很容易當掉,所以這個問題很想快點解決掉,而且看來想知道解決之道的網友不只她一位,因此趕緊抽了個空撰寫本文供大家參考一下。
基本上要達到這樣的效果,方法並不只一種,但是網友告訴我曾有看過類似的資料以 onload 來處理,而我最直覺想到的也是利用 onload 這個指令來完成,因此我將這種方式簡述一下:

假設 index.htm 首頁作為版面分割檔,並設定如下:
<frameset cols="140,*" border=0>
  <frame src="index_menu.htm" name="menu" NORESIZE>
  <frame src="index_main.htm" name="main" NORESIZE>
</frameset>

在 index_menu.htm 檔內設定一個 JavaScript 的程序與變數:
var LoadOK=false;

function chkLink(url){
  if(LoadOK)
    location.href=url;
  else
    alert("頁面資料尚未載入完畢,請稍後再點選!&quothttps://www.fishman.idv.tw/phpforum/thread-1837-1-1.html;
}

在 index_menu.htm 檔內各個選項的連結均改成透過 chkLink() 這個程序來執行:
原先的連結敘述:<A HREF="https://your.site.com/page1.htm">
改成這樣的方式:<A HREF="java script:chkLink('https://your.site.com/page1.htm')">

在 index_main.htm 檔內的 BODY 標籤加上如下之設定:
<BODY onload="parent.frames['menu'].LoadOK=true">
因為 index_menu.htm 檔內的 LoadOK 變數初始值是設為 false,所以當訪客點選連結項目時,在 chkLink() 程序中無法符合 if 的判斷式,所以會執行後面的敘述,也就是顯示一個提示訊息的視窗來,等到 index_main.htm 載入完畢時,在 BODY 標籤所設的 onload 敘述會被觸發,因而將 index_menu 檔內的 LoadOK 變數重設為 true,所以當訪客再次點選連結項目時,在 chkLink() 程序中就能符合 if 的判斷條件,進而作實際的連結動作了!


訪客使用的環境要如何偵測?
(Aug. 03, 1999)
JavaScript 提供了很多的函數可以偵測到瀏覽網頁所使用的一些軟、硬體的規格,有釵h的網頁作者拿這些函數來偵測訪客的瀏覽起種類、版本、畫面解析度....等資訊,若是不符合該網頁的最佳瀏覽規格,則給予提示請其作適當調整,以便達到最佳的瀏覽效果,否則辛苦製作的版面效果可能因而大打折扣,這是很令人傷心的,其實這些函數在 JavaScript 文件中都有列出來,只是有些網友看到那一大疊的文件就頭疼,所以囉~以下我就列出一部份偵測指令及其用途供您參考,希望能對減輕您的頭疼症狀有所幫助:
檢查瀏覽器版本:
var agt=navigator.userAgent.toLowerCase();
var bVer = parseInt(navigator.appVersion);
var NN = (navigator.appName == "Netscape&quothttps://www.fishman.idv.tw/phpforum/thread-1837-1-1.html ? true : false;
var IE = (navigator.appName == "Microsoft Internet Explorer&quothttps://www.fishman.idv.tw/phpforum/thread-1837-1-1.html ? true : false;
var brws;
// 次行為解決 IE5 的 Bug,以便取得其正確版本
bVer = (IE && (bVer == 4) && (agt.indexOf("msie 5.0&quothttps://www.fishman.idv.tw/phpforum/thread-1837-1-1.html!=-1) ) ? 5 : bVer;
if(IE){
  brws="Microsfot Internet Explorer";
}else if(NN){
  brws="Netscape Navigator";
}else{
  brws="不知名";
}
documents.write("您使用的是第 "+bVer+" 版的 "+brws+" 瀏覽器&quothttps://www.fishman.idv.tw/phpforum/thread-1837-1-1.html;
執行結果:
您使用的是第 4 版的 Microsfot Internet Explorer 瀏覽器

另外也可以參考本文另一篇以能來作檢查的方式:不同瀏覽器以及版本應該如何識別?


檢查螢幕解析度:
width=screen.width;
height=screen.height;
documents.write("解析度寬×高="+width+"×"+height);
執行結果:
解析度寬×高=800×600


檢查螢幕色彩度:
colorDepth=screen.colorDepth;
documents.write("色彩度為:"+colorDepth+" Bits ("+Math.pow(2,colorDepth)+"色)&quothttps://www.fishman.idv.tw/phpforum/thread-1837-1-1.html;
執行結果:
色彩度為:16 Bits (65536色)


檢查作業系統種類:
var agt=navigator.userAgent.toLowerCase();
var win95 = ((agt.indexOf("win95&quothttps://www.fishman.idv.tw/phpforum/thread-1837-1-1.html!=-1) || (agt.indexOf("windows 95&quothttps://www.fishman.idv.tw/phpforum/thread-1837-1-1.html!=-1));
var win98 = ((agt.indexOf("win98&quothttps://www.fishman.idv.tw/phpforum/thread-1837-1-1.html!=-1) || (agt.indexOf("windows 98&quothttps://www.fishman.idv.tw/phpforum/thread-1837-1-1.html!=-1));
var winnt = ((agt.indexOf("winnt&quothttps://www.fishman.idv.tw/phpforum/thread-1837-1-1.html!=-1) || (agt.indexOf("windows nt&quothttps://www.fishman.idv.tw/phpforum/thread-1837-1-1.html!=-1));
var OS;
if(win95){
  OS="Windows 95";
}else if(win98){
  OS="Windows 98";
}else if(winnt){
  OS="Windows NT";
}else{
  OS="不知種類的";
}
documents.write("您使用的是 "+OS+" 作業系統&quothttps://www.fishman.idv.tw/phpforum/thread-1837-1-1.html;
執行結果:
您使用的是 Windows 98 作業系統

另外還有釵h的參數可供其它作業系統的識別,詳情請參?Netscape 提供的 JavaScript 文件。


如何才能避免被他人在未經告知的情形下對某些特定頁面作了局部的連結?
(Jul. 30, 1999)
一般在網路上有很多的資訊都是相互連結起來的,通常對各個網站或網頁的首頁連結都無需特別的照會,但是對於首頁以外的單獨頁面或檔案的連結則是有必要先向被連結者徵詢意見的,尤其是被連結的網頁有強調或註明時,切不可以擅自對其作連結,否則就是擅用他人資料,嚴重點就是盜用他人資料了,作者也有類似的困擾,因為我在釵h的頁面明明白白的註明了若欲連結就請連結至首頁位址,但是仍有一些人視而不見,因此我在某些頁面加上了一段 JavaScript 來作檢查,若是在野i的網址以外的外來連結,就顯示一段警告訊息然後不予連結或連結到首頁去,以下就將該段程式列出來供您參考:
(以下程式假設您的網址是 https://www.domain.com/yourid)
// 先以 document.referrer 來取得連結本頁的網頁位置及名稱
var who=document.referrer;

// 判斷連結本頁的網頁位置是否為自己的網址?
// 若是的話將傳回 -1 以外的值,若傳回 -1 則表示是外來的連結
if(who && who.indexOf("www.domain.com/yourid&quothttps://www.fishman.idv.tw/phpforum/thread-1837-1-1.html == -1){
  // 既然是外來的連結,那就在此處加上訊息提示
  alert("單獨連結到本頁是不當的,請連結到○○網頁的首頁!&quothttps://www.fishman.idv.tw/phpforum/thread-1837-1-1.html;
  // 並且將瀏覽器的最上層視窗轉向連結到自己的首頁去
  top.location.href = "https://www.domain.com/yourid/index.htm";
}

請注意!
document.referrer 必須要在網路上實際運作時才會有值存在,若在自己電腦上測試是不會有任何值產生的,因此不會有任何的作用。


如何才能避免被他人窺視網頁的內部設定與敘述?
(Jul. 30, 1999)
這個動作的處理方式我已經寫成範例了,請點選此處參觀範例,如果您對這樣的動作有興趣,請自行參考範例頁面的內容,我在此不多加敘述。  

不同瀏覽器以及版本應該如何識別?
(Jul. 13, 1999)
因為不同的瀏覽器所支援的 HTML 標籤指令有些酗ㄕP,而相同指令的效果也有所差異,更別說是 JavaScript 的指令及函數了,其差異更是大得離譜,常常寫好一個程式後卻無法同時在 IE 及 NN 兩大瀏覽器上正常得執行,因此有必要採取一些特別的做法,一種是不同的瀏覽器分別載入不同適用的頁面檔案,另一種就是直接將不同適用的動作都寫在同一個頁面檔案內,依瀏覽器的種類分別執行適用的部份,前述的動作有一個先決條件,那就是訪客所使用的瀏覽器種類 (甚至是版本),必須要先能檢查出來,以便作相對的載入或執行動作,以下列出瀏覽器種類與版本的檢查方式供您參考,希望對您有幫助:

以瀏覽器名稱來檢查:
// 設定 bName 為取得瀏覽器名稱的變數
var bName = navigator.appName;

// 設定 bVer 為取得瀏覽器版本的變數
var bVer  = parseInt(navigator.appVersion);

// 設定 NN4 為識別是否為 Netscape 瀏覽器且版本大於 4 的變數
var NN4   = (bName == "Netscape" && bVer >= 4);

// 設定 IE4 為識別是否為 Microsoft 瀏覽器且版本大於 4 的變數
var IE4   = (bName == "Microsoft Internet Explorer" && bVer >= 4);

以瀏覽器所支援的能來檢查:
// 設定 NN4 為識別瀏覽器是否支援 document.layers (NN 第 4 版後專有的) 能的變數
var NN4  = (document.layers) ? true : false;

// 設定 IE4 為識別瀏覽器是否支援 document.all (IE 第 4 版後專有的) 能的變數
var IE4  = (document.all) ? true : false;

// 設定 ver4 為識別使用的是否為第 4 版以上瀏覽器的變數
// (某些指令是 IE 及 NN 在第 4 版之後都有支援的,使用那些指令時可以用 ver4 來判別訪客的瀏覽器是否可執行?)
var ver4 = (NN4 || IE4) ? true : false;


如何在參觀者離開我的網頁時顯示一個訊息視窗?
(Jun. 15, 1999)
以下提供一個簡單的例子,您可以自行修改成符合您實際需求的處理動作:
在首頁的網頁主體處作 onUnload 的宣告,指定網頁結束時要執行的函數名稱。
<BODY .... onUnload="UserExit()">

寫一段 JavaScript 宣告及程式碼,將網頁結束時希望執行的動作寫在此處 (記得函數名稱須與前一項宣告的名稱相符合):
<SCRIPT LANGUAGE="JavaScript">
<!--
function UserExit(){
  alert("記得要常來喔!&quothttps://www.fishman.idv.tw/phpforum/thread-1837-1-1.html;
}
//-->
</SCRIPT>

前述的 onUnload 動作會在參觀者輸入其它的網址、點選了超連結項目,以新的網頁內容取代掉您的首頁時或是關閉瀏覽器時被觸發,此時就會執行 UserExit() 這個程序了。


Netscape 瀏覽器在調整視窗大小時,以 JavaScript 處理顯示的畫面會亂掉,應如何解決?
(Apr. 23, 1999)
當下的網路環境中主要的瀏覽器是 Microsoft 的 IE 及 Netscape 的 NN,依照作者的經驗來看,動態網頁應屬 IE 處理的效果比較多也比較好,在兩個瀏覽器的能不完全相同的狀態之下,撰寫動態網頁成了一場惡夢,尤其是 NN 在使用 JavaScript 配合 CSS 使用時,若遇到 HTML 的 FORM 及 TABLE 標籤指令時,就變得無法正常處理了,最讓人頭痛的是在調整視窗大小時,還會將畫面搞得是一團亂,通常有經驗的網友碰這種情形都知道只要將畫面重新載入一次 (Reload) 就可以了,但是沒經驗的網友怎麼辦?難道辛辛苦苦製作出來的漂亮網頁就必須忍受這一項缺憾嗎?可不可以讓網頁內容自動重新整理呢....
以上一連串的疑問也曾經困擾過我,但是現在我找到一個很簡單的方法來解決了,您只要在您的 JavaScript 敘述中加上下列的程式碼就可以了:


在程式的適當位置加上 onload=init; 的敘述。
在 init 函數中作以下的設定:
(假設 NN4 為瀏覽者使用的是 Netscape 4.0 以上版本瀏覽器時)
function init(){
  if(NN4) setTimeout("window.onresize=toReload",500);
}
設定下列自定函數:
function toReload(){
  window.location.reload();
}
以上的設定會在使用 NN 瀏覽器者調整瀏覽視窗大小時,自動的重新將頁面資料載入一次,而達到畫面資料重新整理的效果。  

如何處理訪客停留參觀網頁時間的顯示?
(Mar. 31, 1999)
這個動作的處理方式我已經寫成範例了,請點選此處參觀範例,如果您對這樣的動作有興趣,請自行參考範例頁面的內容,我在此不多加敘述。  

不同時間顯示不同訊息的能要如何製作?
(Mar. 29, 1999)
要處理這樣的動作有很多種方式可達成,以下列出三種供大家參考:
第一種:

設定一個為數 24 的字串陣列,裡面設定 00 時到 24 時欲顯示的訊息字樣。
var prompt_msg = new Array(24);

prompt_msg[0] = "凌晨了耶!吃過宵夜了嗎?可別空著肚皮上網喔!";
prompt_msg[1] = "凌晨一點鐘還能見到您,真是佩服佩服....";
prompt_msg[2] = "凌晨兩點鐘蒙您拜訪,真是太感動了!";
.....

以取得現在時間的函數取得 "時數"。
var today = new Date();
var hour = today.getHours();
將時數代入第 1 向所述的字串陣列中,取得相對的訊息並顯示出來。
documents.write(prompt_msg[hour]);
第二種:
以取得現在時間的函數取得 "時數"。
var today = new Date();
var hour = today.getHours();

以判斷時間區段的方式顯示不同的訊息字樣。
if( (hour < 6) || (hour >= 22) )
  documents.write("真早啊!您是尚未休息還是早起啊?&quothttps://www.fishman.idv.tw/phpforum/thread-1837-1-1.html
else if( (hour >= 19) && (hour < 22) )
  documents.write("晚安!忙碌了一天,讓本站幫您輕鬆一下吧!&quothttps://www.fishman.idv.tw/phpforum/thread-1837-1-1.html
else if( (hour >= 6) && (hour < 9) )
  documents.write("早安!祝您有個美好的一天~&quothttps://www.fishman.idv.tw/phpforum/thread-1837-1-1.html
else
  documents.write("您該不會是翹課或是翹班來訪的吧?可別給逮到喔....&quothttps://www.fishman.idv.tw/phpforum/thread-1837-1-1.html;

第三種:
以取得現在時間的函數取得 "時數"。
today = new Date();
hour = today.getHours();

以判斷時間的時數或是區段的方式顯示不同的訊息字樣。
if(hour ==1)
  documents.write("早安!現在是凌晨一點鐘,您還沒有睡啊?&quothttps://www.fishman.idv.tw/phpforum/thread-1837-1-1.html;
else if(hour ==2)
  documents.write("嗯~凌晨兩點鐘了,可別玩得太晚了喔!&quothttps://www.fishman.idv.tw/phpforum/thread-1837-1-1.html;
else if(hour ==3)
  documents.write("凌晨三點鐘您還在逛啊?&quothttps://www.fishman.idv.tw/phpforum/thread-1837-1-1.html;
else ....



如何設定滑鼠移入及移開超連結時顯示不同的圖檔?
(Aug. 03, 1999)
這個動作是剛接觸網頁製作的網友們最想知道及急於嘗試的動作之一,以下我列出兩種方式供大家參考:
寫成自定函數的方式:

在 JavaScript 宣告中設定:
function ChangePic(n){
  if(n==1){
     document.images['g1'].src='p1.gif';
  }else{
     document.images['g1'].src='p0.gif';
  }
}


在 HTML 中設定:
<a href="...." onMouseOver="ChangePic(1);" onMouseOut="ChangePic(0);">
<img name="g1" src="p0.gif">
</a>

執行結果:



直接在超連結標籤中設定:
<a href="...." onMouseOver="document.images['g1'].src='p1.gif'" onMouseOut="document.images['g1'].src='p0.gif'">
<img name="g1" src="p0.gif">
</a>

執行結果:



當然啦!上邊只是簡單的範例而已,如果您想要作成一個多項目的選單,每個項目都使用不同的圖檔來作變化,那就得好好的改一改囉!這裡只幫您開個頭,其它的要靠自己的巧思了。  

如何才能讓自己網頁所開啟的突顯式視窗一直保持在最上層顯示,直到關閉為止?
(Nov. 29, 1998)
最簡單的方式就是直接在網頁的 BODY 宣告處加上 focus() 的設定,請參考下列的做法:
<BODY onBlur="setTimeout('self.focus()', 200)">
不過您可得記得喔,若有兩個以上的網頁同時被開啟,而且這些網頁都同樣有做上述的處理,那可是會亂成一團的喔!


在參觀者載入首頁時要如何顯示一個歡迎視窗呢?
(Nov. 19, 1998)
這個問題可以使用兩種方式達成,一種是使用 Alert() 訊息提示視窗,另一種是使用 windows.open() 來開啟突顯式(POPUP)視窗,請參考以下兩個範例:
使用 Alert() 訊息提視窗:
alert("歡迎您參觀我的小站!&quothttps://www.fishman.idv.tw/phpforum/thread-1837-1-1.html;
使用 windows.open() 開啟突顯式(POPUP)視窗:
mW=windows.open("", "welcome", "toolbar=0, location=0, directories=0, status=0, menubar=0, scrollbars=0, resizable=0, copyhistory=0, width=300, height=80&quothttps://www.fishman.idv.tw/phpforum/thread-1837-1-1.html;
mW.documents.write("<HTML><HEAD><TITLE>歡迎訊息</TITLE></HEAD>&quothttps://www.fishman.idv.tw/phpforum/thread-1837-1-1.html;
mW.documents.write("<BODY TEXT='#FF0000' BGCOLOR='#D0FFFF'>&quothttps://www.fishman.idv.tw/phpforum/thread-1837-1-1.html;
mW.documents.write("<CENTER><FONT SIZE=+2>歡迎您參觀我的小站!</FONT><BR>&quothttps://www.fishman.idv.tw/phpforum/thread-1837-1-1.html;
mW.documents.write("<A HREF='java script:window.close()'>關閉歡迎視窗</A>&quothttps://www.fishman.idv.tw/phpforum/thread-1837-1-1.html;
mW.documents.write("</CENTER></BODY></HTML>&quothttps://www.fishman.idv.tw/phpforum/thread-1837-1-1.html;
mW.document.close();


如何在瀏覽器的狀態行顯示訊息?
(Nov. 14, 1998)
要顯示訊息於瀏覽器的狀態行,只要使用 status 指令就可以達成,以下提供三個範例供您參考:
隱藏連結項目的網址的顯示,首先設定 nomsg 函數如下:
<SCRIPT LANGUAGE="JavaScript">
<!--
function nomsg(){
self.status="";
}
//-->
</SCRIPT>
接著在連結項目中使用 nomsg 函數,設定方式如下:
<A HREF="https://tacocity.com.tw/urid/pagename.htm"
onMouseOver="nomsg();return true"
>我的某網頁</A>
滑鼠移到連結項目時,直接顯示指定的訊息字樣:
<A HREF="https://tacocity.com.tw/urid/pagename.htm"
onMouseOver="window.status='顯示訊息字樣'; return true;"
>我的某網頁</A>
滑鼠移到連結項目時,直接顯示指定的訊息字樣,滑鼠移開後將狀態行的訊息字樣清除掉:
<A HREF="https://tacocity.com.tw/urid/pagename.htm"
onMouseOver="window.status='顯示訊息字樣'; return true;"
onMouseOut="nomsg();return true"
>我的某網頁</A>


我希望在網頁被載入時能隨機撥放不同的音樂檔,應該怎麼作?
(Feb. 05, 1999)
以下僅提供一個簡單的範例,如果您瞭解了它的動作之後,應該可以修改成更好的程式裝點自己的網頁:

<SCRIPT LANGUAGE="JavaScript">
<!--
var midi = new Array();

midi[1] = ("Silence.mid&quothttps://www.fishman.idv.tw/phpforum/thread-1837-1-1.html;
midi[2] = ("Runaway.mid&quothttps://www.fishman.idv.tw/phpforum/thread-1837-1-1.html;
midi[3] = ("Tokyo.mid&quothttps://www.fishman.idv.tw/phpforum/thread-1837-1-1.html;

function randomNo(limit){
  var rnd = parseInt(Math.random()*limit+1,10)-1;
  return rnd;
}

var nNo = randomNo(midi.length - 1) + 1;
documents.write('Random Midi: ' + midi[nNo]);
documents.write('<embed src="' + midi[nNo] + '" autostart=true width=0 height=0 border=0 loop=true></embed>');
//-->
</SCRIPT>


如何才能在網頁上撥放音樂檔案,並且可以控制音樂檔的撥放與停止?
(Aug. 08, 1999)
以下是節錄並翻譯自 Martin Webb 的一段資料,原文似乎有些錯誤,經本人測試後修改如下:

您可以使用 <EMBED> 這個標籤指令來撥放音樂檔,以下是一個簡短的例子:

<HTML>
<BODY>
<EMBED SRC="sound.wav" AUTOSTART=TRUE HIDDEN=TRUE>
</BODY>
</HTML>


接下來的這一個範例則可以讓您控制音樂檔案的撥放、暫停、停止:

<HTML>
<BODY>

<SCRIPT LANGUAGE="JavaScript">
<!--
function playSound() { document.firstSound.play(); }
function pauseSound() { document.firstSound.pause(); }
function stopSound() { document.firstSound.stop(); }
//-->
</SCRIPT>

<A HREF="java script:playSound()">撥放音樂</A><BR>
<A HREF="java script:pauseSound()">暫停/恢復撥放音樂</A><BR>
<A HREF="java script:stopSound()">停止撥放音樂</A><BR>

<EMBED SRC="sound.wav" HIDDEN=TRUE AUTOSTART=FALSE LOOP=FALSE NAME="firstSound" MASTERSOUND>

</BODY>
</HTML>



執行結果:(下列顯示效果為作者另外加了處理,因此與上列程式碼顯示效果略有出入)  4 ; <


附註:

在上述的範例中,sound.wav 之類的 WAV 檔案也可以適用於 sound.mid 之類的 Midi 檔案。

上述範例在 Netscape 的 NN 瀏覽器可完全適用,Microsoft IE 瀏覽器執行 stop() 的結果似乎與 pause() 相同,而執行 pause() 只能暫停無法繼續,若要繼續播放則需執行 play()。


如何在 POPUP 的視窗上放置關閉該視窗的項目?
(Sep. 27, 1998)
請參考下列兩個範例:

使用 FORM 的按鈕項目來處理時:
<FORM METHOD=POST>
<INPUT TYPE="button" VALUE="關閉視窗" onClick="window.close();">
</FORM>

使用超連結項目來處理時:
<A HREF='java script:window.close()'>關閉視窗</A>


如何讓自己的首頁被連結時,不會被框在別人網頁的 FRAME 內?
(Sep. 27, 1998)
將下列的敘述放到您的首頁之中試試看:
<HTML>
<HEAD>
<SCRIPT LANGUAGE="JavaScript">
<!--
if(self != top) top.location.href = window.location.href;
//-->
</SCRIPT>
.....
</HEAD>
</HTML>


如何才能使得 FOCUS 指向其它 FRAME 載入的網頁之上?
(Sep. 27, 1998)
在各個網頁中做以下的設定,那麼就會在各個網頁被載入時,自動的取得 FOCUS:
<BODY onLoad="self.focus()">


如何做出一個下拉式的選單,並且在點選項目後可以在指定的分割區顯示頁面資料?
(Sep. 27, 1998)
下方的兩個範例假設您已經寫好版面分割配置,並且在 FRAME1 設置下拉式選單,點選後欲顯示指定的網頁檔顯示於 FRAME2 分割區:


第一種方式是透過 SUBMIT 按鈕項目及 OnClick 的敘述來做動作,選擇好欲載入的項目後,再點選 "載入頁面" 按鈕項目即可載入指定的頁面到 FRAME2 分割區:
<SCRIPT LANGUAGE="JavaScript">
<!--
function loadPage(object) {
  parent.FRAME2.location.href = object.options[object.selectedIndex].value;
  return false;
}
//-->
</SCRIPT>

<FORM>
<SELECT NAME="selectName">
<OPTION SELECTED VALUE="">請選擇項目
<OPTION VALUE="page1.html">第一頁
<OPTION VALUE="page2.html">第二頁
.....
</SELECT>
<INPUT TYPE="SUBMIT" VALUE="載入頁面" onClick="return loadPage(this.form.selectName)">
</FORM>


另一種方式比較簡單,可透過 OnChange 敘述來直接做動作,並且是在點選後立即執行:
<FORM>
<SELECT onChange="parent.FRAME2.location.href = this.options[selectedIndex].value; this.selectedIndex=0">
<OPTION SELECTED VALUE="">請選擇項目
<OPTION VALUE="page1.html">第一頁
<OPTION VALUE="page2.html">第二頁
.....
</SELECT>
</FORM>



如何才能使用兩個 SUBMIT 按鈕項來使同一個 FORM 做不同的動作?
(Sep. 27, 1998)
您可以設成兩個 FORM 表單,或是以 BUTTON 按鈕項目配合 onSubmit 來代替 SUBMIT 按鈕項目來達成,請參考下列範例說明:


設成兩個表單的方式,第一個表單的資料欄設成 HIDDEN 不顯示出來,若點選的是第二個表單的 SUBMIT,則將第一個表單的資料複製到第二個表單內,然後才傳送出去:
<SCRIPT LANGUAGE="JavaScript">
<!--
function copydata() {
  document.myform2.data1.value = document.myform1.data1.value;
  document.myform2.data2.value = document.myform1.data2.value;
.....
}
//-->
</SCRIPT>

<FORM NAME="myform1" ACTION="mycgi1.pl" METHOD="POST">
<INPUT TYPE="TEXT" NAME="data1">
<INPUT TYPE="TEXT" NAME="data2">
.....
<INPUT TYPE="SUBMIT" VALUE="使用 CGI1 傳送">
</FORM>

<FORM NAME="myform2" ACTION="mycgi2.pl" METHOD="POST">
<INPUT TYPE="HIDDEN" NAME="data1">
<INPUT TYPE="HIDDEN" NAME="data2">
.....
<INPUT TYPE="SUBMIT" VALUE="使用 CGI2 傳送" onClick="copydata()">
</FORM>


以一個 BUTTON 按鈕來替代第二個動作的 SUBMIT 按鈕項目,若點選的是第二個動作,則透過 onClick 指定的 Function 來改變 FORM 表單的 ACTION 敘述來達成:
<SCRIPT LANGUAGE="JavaScript">
<!--
function action2(){
  document.myform.action ="mycgi2.pl";
}
//-->
</SCRIPT>

<FORM NAME="myform" ACTION="mycgi1.pl" METHOD="POST">
<INPUT TYPE="TEXT" NAME="data1">
<INPUT TYPE="TEXT" NAME="data2">
.....
<INPUT TYPE="SUBMIT" VALUE="使用 CGI1 傳送">
<INPUT TYPE="BUTTON" VALUE="使用 CGI2 傳送" onClick="action2()">
</FORM>



如何可以在送出 FORM 表單後,載入指定的頁面檔?
(Sep. 27, 1998)
這個動作可以透過 onSubmit 讓 FORM 表單被執行時,先到指定的 Function 去做動作,只要在該 Function 處加上相關敘述就可以了,請參考下列範例說明:

<SCRIPT LANGUAGE="JavaScript">
<!--
function nextstep() {
  setTimeout('location.href="thanks.htm"',5000);
}
//-->
</SCRIPT>

<FORM ACTION="mailto:someone@somewhere.com" METHOD="POST" ENCTYPE="text/plain" onSubmit="nextstep()">
<INPUT TYPE="SUBMIT">
</FORM>  

如何使用圖檔來代替 FORM 表單中的 SUBMIT 按鈕項?
(Sep. 27, 1998)
這個動作可以使用圖檔連結項目配合 submit() 來完成,請參考下列範例說明:

<FORM NAME="myform">
.....
<A HREF="java script:document.myform.submit()"><IMG SRC="somepic.jpg"></A>
</FORM>  

如何在 FORM 表單的 SUBMIT 按鈕被點選時,先做指定的檢查,以決定是否要送出表單?
(Sep. 27, 1998)
這個動作可以透過兩種方式來完成,當 checkfunc() 函數傳回 true 時,才會允陳u正的 SUBMIT 動作產生,請參考下列範例說明:

在 FORM 的 ACTION 宣告處透過 onSubmit 敘述來處理:
<FORM ACTION="/cgi-bin/myprog.pl" METHOD="post" onSubmit="return checkfun()&quothttps://www.fishman.idv.tw/phpforum/thread-1837-1-1.html>

或是在 SUBMIT 按鈕項目透過 onClick 敘述來處理:
<INPUT TYPE=SUBMIT value="送出表單" onClick="return checkfunc();">  

如何才能在按下 FORM 表單的 BUTTON 按鈕項目後,在指定的 FRAME 分割區載入其它的頁面檔?
(Sep. 27, 1998)
請參考下列範例說明:

假設您設定一個版面為上下配置的分割檔如下:
<FRAMESET ROWS="20%,*">
<FRAME SRC="mymenu.htm" NAME="menu">
<FRAME SRC="page0.htm" NAME="data">
</FRAMSET>

在上方 menu 分割區的 mymenu.htm 頁面中設定 FORM 項目如下:
<FORM>
載入頁面一<INPUT TYPE="BUTTON" onClick="parent.data.location.href = 'page1.htm;'">
載入頁面二<INPUT TYPE="BUTTON" onClick="parent.data.location.href = 'page2.htm;'">
</FORM>

在下方 data 分割區的 page0.htm 頁面中設成空白或隨意設定一些內容。

當您點選上方 menu 分割區 mymenu.htm 頁面的 BUTTON 按鈕項目後,即會將指定的 page1.htm 或 page2.htm 網頁檔載入至下方的 data 分割區之中。  

要如何做才能在頁面載入完畢後,自動的將游標移到 FORM 表單中指定的輸入欄位中?
(Sep. 27, 1998)
重點在使用 focus() 來達成任務,請參考下列範例:

<FORM NAME="FormName">
<INPUT TYPE="text" NAME="TextField1">
<INPUT TYPE="text" NAME="TextField2">
</FORM>

<SCRIPT LANGUAGE="JavaScript">
<!--
  document.FormName.TextField1.focus();
//-->
</SCRIPT>


參觀者瀏覽器所支援的 JavaScript 版本要如何取得?
(Sep. 27, 1998)
請參考下列範例:

<SCRIPT LANGUAGE="JavaScript">
<!--
var version = 1;
//-->
</SCRIPT>

<SCRIPT LANGUAGE="JavaScript1.1">
<!--
var version = 1.1;
//-->
</SCRIPT>

<SCRIPT LANGUAGE="JavaScript1.2">
<!--
var version = 1.2;
//-->
</SCRIPT>

<SCRIPT LANGUAGE="JavaScript">
<!--
documents.write('您使用的瀏覽器支援 JavaScript ' + version);
//-->
</SCRIPT>


要如何才能檢查參觀者使用的瀏覽器是否支援 JavaScript?
(Sep. 27, 1998)
請參考下列範例:

<HTML>
<HEAD>
<SCRIPT LANGUAGE="JavaScript">
<!--
alert("您使用的瀏覽器有支援 JavaScript&quothttps://www.fishman.idv.tw/phpforum/thread-1837-1-1.html;
//-->
</SCRIPT>

<NOSCRIPT>
您使用的瀏覽器未支援 JavaScript
</NOSCRIPT>
</HEAD>
</HTML>


我可以在 FRAME1 頁面上點選按鈕項目後,去執行 FRAME2 頁面上的 Function 嗎?
(Sep. 27, 1998)
請參考下列範例:

在 FRAME1 網頁的 JavaScript 宣告中呼叫 FRAME2 頁面上 Function 的設定如下:
parent.FRAME2.funcName();

在 FRAME2 網頁的 JavaScript 宣告中設定 Function 如下:
function funcName() {
  .....
}  

如何在新開啟的 POPUP 子視窗中傳遞一個字串或數值給原先開啟該視窗的母視窗頁面?
(Sep. 27, 1998)
重點在 POPUP 子視窗中以 opener 取得母視窗的位置,請參考下列範例:

在 doc1.htm 檔(置於母視窗內)中設定的內容:
<SCRIPT LANGAUGE="JavaScript">
<!--
function newWindow(file,window) {
  msgWindow=open(file,window,'resizable=no,width=200,height=400');
  if(msgwindows.opener == null) msgwindows.opener = self;
}
//-->
</SCRIPT>

<FORM NAME="montherForm">
<INPUT NAME="montherField" TYPE="TEXT" VALUE=""><BR>
<INPUT TYPE="button" VALUE="開啟子視窗並載入 doc2.htm" onClick="newWindow('doc2.htm','childWindow')">
</FORM>

在 doc2.htm 檔(載入子視窗內)中設定的內容:
<SCRIPT LANGUAGE="JavaScript">
<!--
function setForm() {
  opener.document.montherForm.montherField.value = document.childForm.childField.value;
  self.close();
  return false;
}
//-->
</SCRIPT>

<FORM NAME="childForm" onSubmit="return setForm();">
<BR><INPUT NAME="childField" TYPE="TEXT" VALUE="">
<BR><INPUT TYPE="SUBMIT" VALUE="傳給母視窗">
</FORM>

註:開啟子視窗後在子視窗名為 childField 的 TEXT 欄位中輸入資料,然後點選 "傳給母視窗" 的按鈕項目,子視窗會將 TEXT 欄位的資料傳回給母視窗中名為 montherField 的 TEXT 欄位,然後自行關閉掉子視窗。  

一個使用 CGI 運作的 FORM 表單頁面,要如何才能在 CGI Server 故障時仍可將資料改由信件方式寄出?
(Sep. 27, 1998)
請參考下列範例:

<FORM NAME = "myForm" ACTION="/cgi-bin/userform.pl">
您的姓名:<INPUT TYPE=TEXT NAME="name">
<INPUT TYPE=SUBMIT value="以 CGI 傳送">
<INPUT TYPE=BUTTON value="以 EMail 傳送" onClick="return send(this.form)">
<INPUT TYPE=RESET value="重新填寫">
</FORM>

<SCRIPT LANGUAGE="JavaScript">
<!--
function send(form){
  document.myForm.encoding = 'text/plain';
  document.myForm.action ="mailto:myname@same.com?subject=HomePage User Form";
return true;
}
//-->
</SCRIPT>


FORM 表單中的 CHECKBOX 項目值要如何取得?
(Sep. 27, 1998)
請參考下列兩個範例:
寫成函數檢查 CHECKBOX 欄位的 checked 值:
function isChecked(object) {
  if(object.checked) return true;
  else return false;
}


直接查看 CHECKBOX 欄位名稱:
alert(document.formName.checkboxName);


FORM 表單中的 RADIO 項目值要如何取得?
(Sep. 27, 1998)
假設 radioitem 為一組 RADIO 項目的名稱,想要檢查第 2 個項目的狀態時:

if(form.radioitem[2].checked) {
  .....
}  

FORM 表單中的 OPTION 項目值要如何取得?
(Sep. 27, 1998)
假設 selectitem 為一組 SELECT 項目的名稱,想要取得現在被點選的 OPTION 項目的指標時:
var sel = form.selectitem.selectedIndex;

想要取得現在被點選的 OPTION 項目值時:
var selText = form.selectitem.options[form.selectitem.selectedIndex].text;  

如何在頁面上顯示該檔最後編修的日期(Last Modified Date)?
(Sep. 27, 1998)
網頁最後編修的日期係以 lastModified 指令取得,請參考下列範例:

<SCRIPT LANGUAGE = 'JavaScript'>
<!--
function y2k(number) { return (number < 1000) ? number + 1900 : number; }

var date = new Date(document.lastModified);
var cMon = date.getMonth() + 1;
documents.write(y2k(date.getYear())+"年"+cMon.toString()+"月"+date.getDate()+"日 "+date.getHours()+"時"+date.getMinutes()+"分&quothttps://www.fishman.idv.tw/phpforum/thread-1837-1-1.html;
//-->
</SCRIPT>

顯示的結果將會如下:
1998年9月26日 17時9分  

如何傳遞一個字串或數值到另一個網頁?
(Oct. 22, 1998)
請參考下列的範例,重點在欲連結的網頁名稱的後方使用 "?" 符號連接傳遞參數,而在被連結的網頁中使用 search 指令取得參數:

欲傳遞參數到別的頁面的 mainpage.htm 檔:
<FORM>
<SELECT NAME="selectName">
<OPTION>文字一
<OPTION>文字二
<OPTION>文字三
</SELECT>
<INPUT TYPE="BUTTON" VALUE="Go" onClick="window.location.href = 'nextpage.htm?'+this.form.selectName.options[this.form.selectName.selectedIndex].text">
</FORM>

如果是傳遞 TEXT 欄位的資料,就必須用下列方式傳遞:
<INPUT TYPE="TEXT" NAME="userid" size="10">
<INPUT TYPE="BUTTON" VALUE="Go" onClick="window.location.href = 'nextpage.htm?'+this.form.userid.value">

接收參數的 nextpage.htm 檔:


利用 JavaScript 將接收到的參數填入 FORM 的 TEXT 欄位內:
<FORM name="formName">
<INPUT TYPE="TEXT" name="textName">
</FORM>

<SCRIPT LANGUAGE="JavaScript">
<!--
document.formName.textName.value = location.search.substring(1);
//-->
</SCRIPT>

或是利用 JavaScript 直接將接收到的參數組合後,產生 FORM 及 TEXT 欄位的內容:
<SCRIPT LANGUAGE="JavaScript">
<!--
documents.write("<FORM name='formName'>&quothttps://www.fishman.idv.tw/phpforum/thread-1837-1-1.html;
documents.write("<INPUT TYPE='TEXT' VALUE='"+location.search.substring(1)+"'>&quothttps://www.fishman.idv.tw/phpforum/thread-1837-1-1.html;
documents.write("</FORM>&quothttps://www.fishman.idv.tw/phpforum/thread-1837-1-1.html;
//-->
</SCRIPT>


如何計算兩個日期之間的天數?
(Sep. 27, 1998)
請參考下列範例:

function daysElapsed(date1,date2) {
  var d1 = new Date(date1);
  var d2 = new Date(date2);
  var difference = d1.getTime() - d2.getTime();

  return difference/1000/60/60/24;
}
註:date1 為較晚的日期,date2 為較早的日期,例如:daysElapsed("12/15/1998","01/20/1995&quothttps://www.fishman.idv.tw/phpforum/thread-1837-1-1.html。  


返回索引


本文係傅鴻銘所撰寫的,歡迎各位連結 (請連結至首頁位址:https://www.tacocity.com.tw/redsnow/index.htm),如果要轉載全文或節錄部分內文需知會作者並經作者同意。


您或酗]有一些關於使用 JavaScript 設計網頁時遇到的問題或經驗可以提供出來給大家分享的吧?如果您願意的話可以到留言板留言或直接 Mail 給我,我會加以整理然後瞻W來分享給大家。



 本文撰寫於中華民國87年09月12日 修改於中華民國90年02月23日
https://www.fishman.idv.tw/phpforum/thread-1837-1-1.htmlhttps://www.fishman.idv.tw/phpforum/thread-1837-1-1.htmlhttps://www.fishman.idv.tw/phpforum/thread-1837-1-1.html
作者文章推薦
發表於 2002年4月14日 22:13:14 | 顯示全部內容
哇!好一篇非常棒的參考資料
謝啦!參黎?...
只是好像不太好找資料
日期格式不同...
我要回覆
發表於 2003年3月20日 21:02:39 | 顯示全部內容
多謝你啦怪盜讓我學到了很多謝啦
我要回覆
發表於 2004年3月3日 08:05:57 | 顯示全部內容
真是受益良多
感恩啊
我要回覆
發表於 2004年3月21日 14:56:18 | 顯示全部內容
謝謝你提供這麼實用的資訊
雖然我不玩程式
但是我會傳給我那些同學作參考用
我要回覆
懶得打字嗎?讓本助手協助你 【使用進階編輯器請點選右方進階模式】
您需要登入後才可以回覆 登入 | 註冊

本版積分規則

手機版|Archiver|漁家小舖

GMT+8, 2024年4月29日 21:56 , Processed in 0.426662 second(s), 29 queries , Gzip On, Redis On.

Powered by Discuz! X3.5

© 2001-2024 Discuz! Team.

快速回覆 返回頂端 返回清單