HTML 網頁設計筆記 > HTML 表單中的 checkbox 核取方塊設計
HTML 表單中的 checkbox 核取方塊設計
HTML 表單中的 checkbox 核取方塊的功能是用來設計複選的網頁表單，例如提供給網友勾選興趣的表單，也許一次勾選好幾種興趣，就可以用 HTML 表單預設的 checkbox 核取方塊來製作。HTML 表單有三種常見的選單功能，分別是 select option 下拉選單、radio button 選項按鈕以及本篇介紹的 checkbox 核取方塊，其中只有 checkbox 核取方塊能夠一次做出多選的功能，而 select option 下拉選單與 radio button 選項按鈕都要使用多組才能做出多選效果，以下我們就來看看 checkbox 核取方塊的語法規則以及實際範例。HTML checkbox 語法規則HTML 的 checkbox 核取方塊的 type 必須要用 checkbox，同一個表單可以使用多個不同的 checkbox，每一個 checkbox 的 name 與 value 都應該要與其他的 checkbox 不一樣，這樣當網有勾選好並送出表單後，負責接收表單資料的 PHP 程式才有辦法判斷網友都選的是哪幾個項目，我們寫個簡單的 checkbox 範例給各位讀者朋友們參考。HTML checkbox 實際範例輸出結果 你最喜歡吃什麼水果 蘋果 香蕉 橘子 範例在一個 HTML 表單中寫了一個簡單的問題，並提供三個不同的選項給網友勾選，每個選項都是用 checkbox 來製作，可以看到三個選項的 type 都是 checkbox，差別在選項值 value 與選項名稱 name，當網友勾選任何一個選項或多個選項，送出這個表單，後端的 test.php 就可以接收到網友勾選了哪幾個項目，這就是 HTML checkbox 的基本用法。關於表單的設計規則請參閱《HTML Form 表單設計》篇的詳細介紹。如果你想要找的是單選的選單功能，請參閱：HTML radio button 選項按鈕設計。更多 HTML Form 表單元素HTML select option 下拉選單設計HTML input type submit 送出表單按鈕HTML input type button 按鈕設計HTML input type hidden 表單隱藏欄位應用
分享於 2014-12-15 - 更新於 2017-07-31
最新分享主題
HTML div 標籤
HTML span 標籤
HTML element 的基本介紹
HTML Table cellpadding 屬性
HTML Table cellspacing 屬性
HTML Table rowspan 屬性
HTML Table colspan 屬性
HTML iframe 框架設計
修改按鈕大小 Set HTML button size
HTML button disabled 停用按鈕
累積熱門文章
HTML input type text 表單文字欄位
HTML input type password 表單密碼欄位
透過 colspan 合併 HTML Table 表格欄位
HTML select option 下拉選單設計
修改按鈕大小 Set HTML button size
如何設計網頁跑馬燈
HTML 表格設計篇 TABLE
HTML Form 表單設計
圖片型網頁跑馬燈設計
HTML input type hidden 表單隱藏欄位應用