select标签multiple属性的原生复选功能

select标签multiple属性的原生复选功能

        select标签属性中，添加multiple="multiple"设置，就将select修改为复选形式了。

        不过弊端在于不能像单选模式一样，选择之后选项框自动折叠。所以需要根据size="*"属性配合使用,来定义可见选项的数目.
 

<select class="demo" multiple="multiple"  size="3">  
    <optgroup label="Languages">  
        <option value="cp">C++</option>  
        <option value="cs">C#</option>  
        <option value="oc">Object C</option>  
        <option value="c">C</option>  
    </optgroup>  
    <optgroup label="Scripts">  
        <option value="js">JavaScript</option>  
        <option value="php">PHP</option>  
        <option value="asp">ASP</option>  
        <option value="jsp">JSP</option>  
    </optgroup>  
</select> 

 

备注:在不同操作系统中，选择多个选项的差异：

•    对于 windows：按住 Ctrl 按钮来选择多个选项   
•    对于 Mac：按住 command 按钮来选择多个选项