文字鏈結是最方便的超鏈結方式，但有時候為了整體網頁的配置而無法完整地表示鏈結的目的地，這個時候我們可以設定一個表單文字欄位來作詳細的說明！
- 程式碼第35至37行，我們在網頁主體(BODY)內，建立了一個表單「MYFORM」，而在表單內又佈置了一個單行文字方塊元件「ANS」，用來放置項目導覽說明的資料，所以，當我們要將資料放入文字方塊元件時必須使用下列敘述：document.MYFORM.ANS.value=”資料”。
- 在文字鏈結中我們都使用了兩個滑鼠事件，onMouseOver與onMouseOut，當滑鼠指標進入超鏈結時觸發onMouseOver事件，onMouseOver事件會呼叫inside()函式，而在「ANS」文字方塊元件中做出超鏈結項目說明的跑馬燈效果；當滑鼠指標移出超鏈結時觸發onMouseOut事件，onMouseout事件會呼叫outside()函式，而在「ANS」文字方塊元件中顯示預設文字。
- 在呼叫inside()函式時，必須給予參數，此參數的目的在於取出相對應於該參數之變數陣列「msg」中的陣列元素資料，同時將該陣列元素資料輸出於「ANS」文字方塊元件中。
下拉式選單應用
下拉式選單是表單元件的一種，我們只要利用<select name=”名稱”>HTML標籤就可以把它建立出來，但這只是一個空殼，下拉式選單還必須包含選單項目，要建立選單項目必須使用<option>HTML標籤來建立：
基本的下拉式選單是由一個「文字方塊」與一個「下拉按鈕」所組合而成，在文字方塊中會顯示我們第一個利用<option>HTML標籤建立出來的資料項目，在我們沒有按下「下拉按鈕」之前，我們只能看到這第一個利用<option>HTML標籤建立出來的資料項目。當我們拉下清單列表，點選其中的資料項目，以上例來說：假設點選「office學園」，結果被點選資料項目就會出現在上面的欄位中。
下拉式選單中的項目是採陣列集合方式，所以，每個資料項目就是一個陣列元素，而這個陣列名稱就叫做「options」。
在上例中，我們建立了一個表單：「myform」，「myform」表單中含有一個下拉式選單元件「myselect」，假設，我們現在要取回下拉式選單元件「myselect」中資料項目的值，那我們的程式敘述該如何寫？我們知道一個下拉式選單元件「myselect」是隸屬於表單「myform」的成員，而表單又只是document物件的一部份，因此要存取下拉式選單元件「myselect」中的資料，我們就必須這樣：「我要存取document中myform表單的myselect下拉式選單元件內編號為x的項目資料」，若利用JavaScript程式是敘述來表示，則如下式：
當我們拉下清單列表，點選其中的資料項目時，下拉式選單將會用「selectedIndex」屬性來記錄被選取資料項目的「編號」，以上例來說：假設點選第三個資料項目「office學園」，結果被點選資料項目就會出現在上面的欄位中，此時，「selectedIndex」屬性所記錄的編號就是「2」！
實作學習：
用下拉式選單設計一個網站快選功能程式。
當我們拉下清單列表，點選其中的資料項目時，將會引發一個「OnChange」事件，也就是說：當下拉選單上方的文字方塊內容改變時就是「OnChange」事件被觸發之時。在上例中，我們就是利用「OnChange」事件被觸發時呼叫changeurl()函式來改變瀏覽器目前的連結位址（原始碼第12行）。
基本的下拉式選單是由一個「文字方塊」與一個「下拉按鈕」所組合而成，在文字方塊中會顯示我們第一個利用<option>HTML標籤建立出來的資料項目，在我們沒有按下「下拉按鈕」之前，我們只能看到這第一個利用<option>HTML標籤建立出來的資料項目。當我們拉下清單列表，點選其中的資料項目，以上例來說：假設點選「office學園」，結果被點選資料項目就會出現在上面的欄位中。
下拉式選單中的項目是採陣列集合方式，所以，每個資料項目就是一個陣列元素，而這個陣列名稱就叫做「options」。
在上例中，我們建立了一個表單：「myform」，「myform」表單中含有一個下拉式選單元件「myselect」，假設，我們現在要取回下拉式選單元件「myselect」中資料項目的值，那我們的程式敘述該如何寫？我們知道一個下拉式選單元件「myselect」是隸屬於表單「myform」的成員，而表單又只是document物件的一部份，因此要存取下拉式選單元件「myselect」中的資料，我們就必須這樣：「我要存取document中myform表單的myselect下拉式選單元件內編號為x的項目資料」，若利用JavaScript程式是敘述來表示，則如下式：
當我們拉下清單列表，點選其中的資料項目時，下拉式選單將會用「selectedIndex」屬性來記錄被選取資料項目的「編號」，以上例來說：假設點選第三個資料項目「office學園」，結果被點選資料項目就會出現在上面的欄位中，此時，「selectedIndex」屬性所記錄的編號就是「2」！
實作學習：
用下拉式選單設計一個網站快選功能程式。
當我們拉下清單列表，點選其中的資料項目時，將會引發一個「OnChange」事件，也就是說：當下拉選單上方的文字方塊內容改變時就是「OnChange」事件被觸發之時。在上例中，我們就是利用「OnChange」事件被觸發時呼叫changeurl()函式來改變瀏覽器目前的連結位址（原始碼第12行）。
「this」關鍵字
當我們使用到網頁中的表單元件時，像上一實作學習中：「document.myform.myselect.selectedIndex」，為了取得被選取項的索引編號，洋洋灑灑的寫了一長段，不但打的手酸，程式碼也拖的相當長，如果我們將實作學習上一中的函式捨去，直接將程式敘述寫在「OnChange」事件中可能會短一些：
問題是：敘述還是拖的很長ㄚ！所以，要使程式碼短一些、少打點字，我們就可以使用『this』關鍵字。
『this』關鍵字可以替代元件本身的名字，像在上一實作學習中「document.myform.myselect.selectedIndex」這段，就可以寫成「this.myform.myselect.selectedIndex」，好像沒什麼用嘛！但是，若直接將程式敘述寫在「OnChange」事件中，那『this』關鍵字可就好用了！因為我們程式敘述是在表單中的<select>內執行的，因此，我們原先撰寫的「document.myform.myselect」就可以用『this』關鍵字來取代：
實作學習：
利用下拉式選單配合『this』關鍵字設計一個更換網頁背景色程式。
當我們使用到網頁中的表單元件時，像上一實作學習中：「document.myform.myselect.selectedIndex」，為了取得被選取項的索引編號，洋洋灑灑的寫了一長段，不但打的手酸，程式碼也拖的相當長，如果我們將實作學習上一中的函式捨去，直接將程式敘述寫在「OnChange」事件中可能會短一些：
問題是：敘述還是拖的很長ㄚ！所以，要使程式碼短一些、少打點字，我們就可以使用『this』關鍵字。
『this』關鍵字可以替代元件本身的名字，像在上一實作學習中「document.myform.myselect.selectedIndex」這段，就可以寫成「this.myform.myselect.selectedIndex」，好像沒什麼用嘛！但是，若直接將程式敘述寫在「OnChange」事件中，那『this』關鍵字可就好用了！因為我們程式敘述是在表單中的<select>內執行的，因此，我們原先撰寫的「document.myform.myselect」就可以用『this』關鍵字來取代：
實作學習：
利用下拉式選單配合『this』關鍵字設計一個更換網頁背景色程式。
沒有留言:
張貼留言