HTML網站制作表單復選框代碼示例教程

作者：佚名   時間：2014-03-31   分享到：

HTML網站制作表達復選框代碼示例教程

復選框(checkbox)

表單控件為用戶提供了一種在表單中選擇或取消選擇某個條目的快捷方法。復選框也可以集中在一起而產生一組選擇，用戶可以選擇或取消選擇 組中的每一個選項。

通過把每個<input>標簽中的type屬性都設置為checkbox,就可以生成單獨的復選框。其中要包括必需的n~和value屬性。如果用戶選擇了某項，在提交表單時，它就要給出一個值。如果用戶沒有選擇該項，該元素就不會給出任何值。如果用戶沒有用鼠標單擊某個復選框取消選擇，那么可選的checked屬性(沒有值)將告訴瀏覽器要顯示一個選中狀態的復選框，并且告訴瀏覽韶向服務器提交表單時要包含一個值。

在將表單提交給服務器時，瀏覽器會包含選中的復選框的值和其他表單參數的值。選中的復選框的這些值是你在必需的value屬性中指定的文本字符串。

例如，在XHTML中:   <form>   你有什么寵物?
    <p>     <input type=“checkbox" name="pets" value="狗" />狗
    <br/>
    <input type="checkbox" checked="checked" name="gets" value="貓" />貓
    <br/>
    <input type="checkbox" name="pets” value="鳥" />鳥
    <br/>
    <input type=’checkbox" name=’pets’ value="魚" />魚
    </p> </form>

上述代碼可以生成一個復選框組，如圖：

雖然每個復選框控件都是這個組的一部分，但每個控件在屏幕卜都是一個獨立的選項。清注意，雖然我們也考慮到了狗、鳥 ,魚的愛好者，但在標簽中預先將貓)的復選框設置為checked屬性。我們還提供了文字標記，

相似的value屬性不會在瀏覽器的窗口中顯示，但是如果復選框被選中，井且被用戶提交給服務器，這些值會包括在表單參數列表中。同時，還需要使用段落或行間距標簽來控制復選框組的布局，就像對其他表單控件所做的設置一樣。

在上面的示例中，如果在提交表單時，貓和魚被選中的話，在發送給服務器的參數列表中包含的值就應該是:pets=貓 pets=魚