網站建設中設計表單動作按鈕方法

作者：佚名   時間：2014-04-01   分享到：

動作按鈕
雖然這個術語很令人困惑，但對表單來說，還有另外一類按鈕。與前面所說的單選按鈕和復選框不同，這些特殊類型的表單控件可以立即發生作用，但是它們的效果無法保留，而且它們直接影響整個表單的內容，而不是只影響單獨一個字段的值。 

這些“動作(action )”按鈕(目前還沒有一個更好的術語來描述它們)包括提交按鈕、重置按鈕和一些可單擊的圖像按鈕。當用戶選擇這些按鈕后，提交按鈕和圖像按鈕會讓瀏覽器將所有表單的參數都提交給表單處理服務器。一個通常意義上的按鈕不會提交表單，但是可以用來激活一個applet，以操作或驗證表單。重置按鈕則可以在本地發生作用，將部分填完的表單變回它原來的模樣。
提交按鈕 

顧名思義，提交按鈕(submit button, )會啟動將表單數據從瀏覽器發送給服務器上的提交過程。一個表單中可以有多個提交按鈕。也可以利用表單按鈕的提交類型設置n~和value屬性。


對于最簡單的提交按鈕(這個按鈕不包括n~或value屬性)來說，瀏覽器會顯示一個小的長方形或橢圓形，上面有默認的標記“Submit(提交)”。在其他情況下，瀏覽器會用你在標簽的value屬性中設置的文本來標記按鈕。如果給出了一個name屬性，當瀏覽器將表單信息發送給服務器時，也會將提交按鈕的value屬性的值添加到參數列表中。這一點非常有幫助，因為它提供了一種方法來標識表單中被單擊的那一個按鈕，這樣就可以用一個簡單的表單處理應用程序來處理多個不同表單中的某個表單。
下面是一些有效的提交按鈕:





第一個提交按鈕是HTML格式的，也是最簡單的按鈕:瀏覽器會顯示一個標記為"Submit(提交)”的按鈕，當用戶單擊這個按鈕，它就會激活表單處理程序。當瀏覽器將表單數據傳遞給表單處理服務器和應用程序時，不會在參數列表中添加任何元素。
第二個示例也是HTML格式的按鈕，它有一個可以將按鈕標記為“Order Kumquats"的value屬性，但是和上一個示例一樣，表單的參數列表中也不會包括按鈕的值。最后一個示例是XHTML格式的，它設置了按鈕的標記，并使其成為表單參數列表的一部分。當用戶單擊該按鈕后，該提交按鈕會將ship style="ShipOvernight"作為參數添加到表單參數列表中。
重置按鈕
    表單按鈕的重置(reset)類型幾乎是不言而喻的:它允許用戶重置表單中的所有元素，也就是清除或設置某些默認值。與其他按鈕不同，重置按鈕不會激活表單處理程序。相反，瀏覽器將完成所有重置表單元素的工作。服務器永遠不會知道(或者在這種情況下是關心)用戶是否或者何時單擊了重置按鈕。

默認情況下，瀏覽器會顯示一個標記為“Rese“重置)”的重置按鈕。你可以在value屬性中指定自己的按鈕標記，改變默認設置。
下面是兩個有關重置按鈕的示例


定制圖像按鈕
表單元素的image類型會創建一個定制按鈕，這個按鈕是個可單擊的圖像。這是一個用特定圖像生成的特殊按鈕，當用戶單擊該按鈕后，瀏覽器會將表單提交給服務器，同時在表單的參數列表中包括鼠標指針所在位置的“x,y”坐標，這與鼠標敏感圖像映射非常相似。


除圖像文件的URL之外，圖像按鈕還需要一個src屬性，還可以包括一個name屬性和一個針對非圖形瀏覽器的描述性alt屬性。雖然HTML 不贊成使用align屬性，我們還是可以使用這個屬性來控制圖像在當前文本行中的對齊方式。如果有邊框的話，可以使用border屬性來控制邊框的寬度，瀏覽器會像標簽中的border屬性那樣，在邊框周圍放置表單圖像（IE瀏覽器不會在表單的圖像元素周圍放置邊框)。
下面是兩個有效的圖像按鈕: