跳到主要內容
:::|

10.5:H310004 在網頁文字輸入區中須有預設值

說明:對於網頁中的多行文字輸入方塊,為了方便身心障礙者使用特殊的瀏覽器可以辨別其功能,必須在文字輸入區中有預設值。

範例:在INPUT標籤中可以使用value的屬性,在為文字輸入區中設定提示文字;在本文區域輸入欄位中,是可以在TEXTAREA標籤中輸入提示文字,讓使用者了解在該文字框內應輸入什麼資料;在選單區< option >中,提供預設值引導使用者進行相關資訊的選擇。

以下例子是未使用任何提示文字:

不良設計

在文字輸入區 < TEXTAREA > 中,沒有預設的文字提示;在選單區 < option > ,未設定預設值。

不良設計:

< FORM > < LABEL for="username1" > 姓名: < /LABEL > < INPUT type="text" name="yourname" id="username1" > < LABEL for="jobdesc1" > 工作經歷: < /LABEL > < TEXTAREA name="jobdescription" id="jobdesc1" rows="5" cols="60" > < /TEXTAREA > < SELECT name="selectSchoolRecord" > < OPTION value="0" > **請選擇教育程度** < /option > < OPTION value="1" > 國小 < /option > < OPTION value="2" > 國中 < /option > < OPTION value="3" > 高中 < /option > < OPTION value="4" > 大專 < /option > < OPTION value="5" > 碩士 < /option > < OPTION value="6" > 博士 < /option > < /SELECT > < INPUT type="submit" value="送出資料" > < INPUT type="reset" value="重新輸入" > < /FORM >


正確示範

在文字輸入區中,提示文字讓使用者知道該文字輸入區需輸入何種資訊;在選單區 < option > ,提供預設值引導使用者進行相關資訊的選擇。

正確範例:

< FORM > < LABEL for="username2" > 姓名: < /LABEL > < INPUT type="text" name="yourname" id="username2" value="請輸入您的姓名" > < LABEL for="jobdesc2" > 工作經歷: < /LABEL > < TEXTAREA name="jobdescription" id="jobdesc2" rows="5" cols="60" > -- 請輸入您的工作經歷-- < /TEXTAREA > < LABEL for="selectSchoolRecord" > 教育程度: < /LABEL > < SELECT name="selectSchoolRecord" id="selectSchoolRecord" > < OPTION value="0" > **請選擇教育程度** < /option > < OPTION value="1" > 國小 < /option > < OPTION value="2" > 國中 < /option > < OPTION value="3" > 高中 < /option > < OPTION value="4" selected > 大專 < /option > < OPTION value="5" > 碩士 < /option > < OPTION value="6" > 博士 < /option > < /SELECT > < INPUT type="submit" value="送出資料" > < INPUT type="reset" value="重新輸入" > < /FORM >

上一頁| 回首頁