【公告】網站目前停止所有的課程訂閱服務,原有學員權益不受影響,造成不便還請見諒,我們正在打造更多課程以及圖書,包含 Python 為主的課程主題,未來將會合併且擴充目前的課程內容,提供全新課程訂閱服務,感謝學員的支持。
【公告】《Entity Framework 實務精要》 絕版優惠學習活動,是針對最後一批少量書籍絕版的短期特別活動,只提供 20 個名額(剩 7 名),教學影片要在今年暑假過後才會重新開放訂閱,並沒有提供之前單獨購書的讀者,還請見諒, 如果您需要教學影片,屆時再請參與,也感謝讀者學員的支持,我們正在開發更多的教學內容,歡迎與我們一起努力。
《Entity Framework 實務精要》 絕版優惠學習活動》

設定 INPUT 元素的關聯表單- form 屬性

傳統的表單設計必須將 <input> 標籤配置於表單中,才能傳送資料,現在可以可以透過 form 屬性進行設定。

例如有一個 <form> 的 id 屬性值為 myform ,將其設定給 <input> 標籤的 form 屬性,則擁有此屬性值的 <input> 標籤將與此表單產生關聯,成為其內含元素。

form 屬性可以讓網頁的設計配置更為彈性,以下是一個簡單的示範:




淺灰色區域為一<form>構成的表單區域,第一個文字方塊 msg1 與傳送按鈕同時配置於其中,另外兩個文字方塊則配置於表單外部,其中內容文字為 Tom 的文字方塊 msg2 其 form 屬性指定為 form 元素,因此當按下「傳送資料」按鈕時, Tim 與 Tom 兩組字串隨著 URL 回傳伺服器。第三個文字方塊 的內容文字 Tracy 因為不屬於表單,亦無設定 form 屬性進行關聯,因此沒有被傳送。以下是按下按鈕時的瀏覽器網址列內容:



以下為配置的內容:

<form id="sform" style="background-color: #f7f7f7; padding: 6px;">
         <input name="msg1" type="text" value="Tim" />
         <input id="Button1" type="submit" value="傳送資料" />
</form>
<input form="sform" name="msg2" type="text" value="Tom" />
<input name="msg3" type="text" value="Tracy" />

沒有留言: