下拉菜單允許用戶從預(yù)定義的選項(xiàng)列表中選擇單個(gè)項(xiàng)目。size屬性的值為1告訴瀏覽器您希望列表位于下拉菜單中格式。
在select元素中,為每個(gè)選項(xiàng)創(chuàng)建一個(gè)選項(xiàng)元素。
將選項(xiàng)標(biāo)簽放在< option> ...< / option> 標(biāo)簽。
每個(gè)選項(xiàng)元素都可以有一個(gè)可選的value屬性,如果選擇了該選項(xiàng),則是發(fā)送到服務(wù)器的值。
如果您不包含值屬性,則< option> ...< / option>代碼:
<label for="pullDownMenu">A pull-down menu</label> <select name="pullDownMenu" id="pullDownMenu" size="1"> <option value="option1">Option 1</option> <option value="option2">Option 2</option> <option value="option3">Option 3</option> </select>
列表框的工作原理類似于下拉菜單,除了它一次顯示幾個(gè)選項(xiàng)。
要將下拉菜單轉(zhuǎn)換為列表框,請(qǐng)將size屬性從1更改為數(shù)字的選項(xiàng)一次顯示:
<label for="listBox">A list box</label> <select name="listBox" id="listBox" size="3"> <option value="option1">Option 1</option> <option value="option2">Option 2</option> <option value="option3">Option 3</option> </select>
多選列表框允許用戶選擇多個(gè)通過按住Ctrl或Command鍵一次。
要將正常列表框轉(zhuǎn)換為多選框,向select元素添加值為“multiple"的屬性multiple。
如果用戶選擇多個(gè)選項(xiàng),則選擇所有選定的值發(fā)送到服務(wù)器:
<label for="multiListBox">A multi-select list box</label> <select name="multiListBox" id="multiListBox" size="3" multiple="multiple"> <option value="option1">Option 1</option> <option value="option2">Option 2</option> <option value="option3">Option 3</option> </select>
您可以通過添加屬性在任何類型的select元素中預(yù)選擇一個(gè)選項(xiàng)selected =“selected"到相關(guān)的< option> 標(biāo)記 - 例如:< option value =“option1"selected =“selected"> ;.
將以下腳本命名為index.php。 它有一個(gè)多選列表框。
<html> <body> <div> <form action="index.php" method="post"> <p><select name="products[]" multiple="multiple"> <option>A</option> <option>B</option> <option>C</option> <option>D</option> </select></p> <p><input type="submit" value="hit it!" /></p> </form> </div> </body> </html>
以下腳本用于index.php。
<?php/*from ww w . j ava 2 s . c o m*/
if (is_array ( $_POST ["products"] )) {
print "<p>Your product choices are:</p>";
print "<ul>";
foreach ( $_POST ["products"] as $value ) {
print "<li>$value</li>\n";
}
print "</ul>";
}
?>
更多建議: