select标签

select标签

• select 元素可创建单选或多选菜单；

下拉列表

# 对下拉列表进行命名
<select name="city">    


# 设置下拉列表的大小，默认为1;
<select name='city' size='10'>


# 设置下拉列表为多选，浏览器使用时ctrl+你的选择;
<select name='city' size='10' multiple='multiple'>


# 设置下拉列表内容的默认值;
<option value='1' selected='selected'>Beijing</option>

下拉列表实例:

• 实现一个下拉列表，显示你要选择的城市；
• selected属性决定了Shanghai是默认选中的城市;
• value值代表你选中的城市给后台传递的参数;
• ctrl+鼠标，可以选中多个城市;

<form>
    # 行内标签，相当白板，css可对其做任何操作;
    <span>city:</span>

   # 下拉列表标签,name是选择的内容名称，以便后台接收及操作;
    <select name="city">

    # 下拉列表的内容,value值是传送给city，selected是指默认值;
        <option value="1">Beijing</option>
        <option value="2" selected="selected">Shanghai</option>
        <option value="3">Chongqing</option>
        <option value="4">Chengdu</option>
    </select>
    <br/>
    <input type="submit" value="submit">
    <input type="reset" value="reset">
</form>

下拉框分类显示

• 显示有Shanxi和Sichuan两个大类，但是不能被选中;
• Shanxi中可以选中Xian和Baoji，Sichuan可以选中Lesha和Chengdu；

<form>
    <select name="city">
        # 分组显示
        <optgroup label="Shanxi">
            <option value="'1">Xian</option>
            <option value="'2">Baoji</option>
        </optgroup>
        <optgroup label="Sichuan">
            <option value="3">Leshan</option>
            <option value="4">Chengdu</option>
        </optgroup>

    </select>
    <br/>
    <input type="submit" value="submit">
    <input type="reset" value="reset">
</form>