select选择框

阅读量: 150 编辑

select 选择框

一、语法

选择框 <select> 标签:主要用于数据的选择,比如说我们常常在一些网站上填写:省份、城市、地区的时候,使用的就是 select

  • 属性 name:我们提交数据的时候,后台根据 name 来取前端传过去的数据

  • 属性 value:就是选择了的数据,并提交到后台的

  • 属性 selected,表明是否选中,也就是在 select 框中显示的那个选项

  • <option> 一起使用,option 就是 select 中的一个个选项。option 中的 value 属性表示 select 要提交的值

  • 一般结合 form 标签使用

<form>
	<select name="province">
        <option value="1">北京</option>
        <option value="2">上海</option>
    </select>
</form>

二、代码实战

代码的详细解读,可以参考视频教程

文件:13.html

<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>Title</title>
    </head>
    <body>

        <form method="get" action="http://localhost:8080/xxx.do" enctype="multipart/form-data">
            <ul>
                <li><input name="myname" value="zhangsan"></li>
                
                <li>
                    <select name="myselect">
                        <optgroup>
                            <option value="1">本科</option>
                            <option value="2" selected>硕士</option>
                            <option value="3">博士</option>
                        </optgroup>
                    </select>
                </li>
                
            </ul>

            <button type="submit">提交</button>
            
        </form>

    </body>
</html>