关于Html5中的单选与多选
1、下拉列表样式:
<select>
<option value ="volvo">Volvo</option>
<option value ="saab">Saab</option>
<option value="opel">Opel</option>
<option value="audi">Audi</option>
</select>
属性列表
autofocus | autofocus | 规定在页面加载后文本区域自动获得焦点。 |
disabled | disabled | 规定禁用该下拉列表。 |
form | form_id | 规定文本区域所属的一个或多个表单。 |
multiple | multiple | 规定可选择多个选项。 |
name | name | 规定下拉列表的名称。 |
required | required | 规定文本区域是必填的。 |
size | number | 规定下拉列表中可见选项的数目。 |
1.1 单选按钮
<input type="radio" name="sex" value="male" /> Male
<input type="radio" name="sex" value="female" /> Female
一般用<label>加以限定。Input高级功能http://www.w3school.com.cn/tags/tag_input.asp
2.多选列表框
<select multiple="multiple">
<option value ="volvo">Volvo</option>
<option value ="saab">Saab</option>
<option value="opel">Opel</option>
<option value="audi">Audi</option>
</select>
可规定选项组:
http://www.w3school.com.cn/tags/tag_optgroup.asp
<select>
<optgroup label="Swedish Cars">
<option value ="volvo">Volvo</option>
<option value ="saab">Saab</option>
</optgroup> <optgroup label="German Cars">
<option value ="mercedes">Mercedes</option>
<option value ="audi">Audi</option>
</optgroup>
</select>
2.1、多选按钮
<input type="checkbox" name="sex" value="male" /> Male
<input type="checkbox" name="sex" value="female" /> Female
3、input中也有multiple属性,不过他是用在type="file"中的,用于上传文件多选的。
4、取select的值。对于下拉列表来说,表单提交时是会自动提交该值的,值为selectName:selectedValue形式。
对于多选列表框,提交时也是数组形式,同多选按钮
o = document.getElementById("lbTest");
var intvalue="";
for(i=0;i<o.length;i++){
if(o.options[i].selected){
intvalue+=o.options[i].value+",";
}
}
作为数组访问
(PS:该元素是一个HTML特殊元素,叫做HTMLSELECTELEMENT,对象参考http://www.w3school.com.cn/jsref/dom_obj_select.asp)
JQuery可用
var realvalues = [];
var textvalues = [];
$('#rightItem :selected').each(function(i, selected) {
realvalues[i] = $(selected).val();
textvalues[i] = $(selected).text();
});
方式访问
对于多选按钮,提交时是一个数组,规定多选按钮的name属性均相同。
关于Html5中的单选与多选的更多相关文章
- Webform之Repeater中的单选和多选的应用以及前段JS的实现
HTML中的代码 <asp:Repeater ID="Repeater1" runat="server"> <HeaderTemplate&g ...
- dev中ASPxListBox单选和多选的设置
只需要设置SelectionMode,为Multiple时是单选,CheckColumn时是多选
- Webfrom 生成流水号 组合查询 Repeater中单选与复选控件的使用 JS实战应用
Default.aspx 网页界面 <%@ Page Language="C#" AutoE ...
- Webfrom 生成流水号 组合查询 Repeater中单选与复选控件的使用 JS实战应用
Default.aspx 网页界面 <%@ Page Language="C#" AutoE ...
- 如何在Android的ListView中构建CheckBox和RadioButton列表(支持单选和多选的投票项目示例)
引言 我们在android的APP开发中有时候会碰到提供一个选项列表供用户选择的需求,如在投票类型的项目中,我们提供一些主题给用户选择,每个主题有若干选项,用户对这些主题的选项进行选择,然后提交. 本 ...
- 在微信框架模块中,基于Vue&Element前端,通过动态构建投票选项,实现单选、复选的投票操作
最近把微信框架的前端改造一下,在原来基于Bootstrap框架基础上的微信后台管理,增加一套Vue&Element的前端,毕竟Vue的双向绑定开发起来也还是很方便的,而且Element本身也提 ...
- vue 表格中的下拉框单选、多选处理
最近在用vue做前后端分离,需要在表格中用到下拉框,由于需求变动,从最开始的单选变为多选,折腾了许久,记录一下,供后人铺路 vue 中的表格下拉框单选 collectionsColnumOptions ...
- HTML <select> 标签 创建单选或多选菜单
所有主流浏览器都支持 <select> 标签. select 元素可创建单选或多选菜单. <select&> 元素中的 <option> 标签用于定义列表中 ...
- HTML5中常用的标签(及标签的属性和作用)
1.标签:<!DOCTYPE>作用:声明是文档中的第一成分,位于<html>标签之前. 2.标签:<html>作用:此元素可告知浏览器其自身是一个HTML文档.属性 ...
随机推荐
- Java 局部变量和成员变量(全局变量)
局部变量 定义在类的方法内或者代码块内的变量 局部变量只在定义它的方法体内或者代码块内有效 局部变量在使用前,必须先初始化 全局变量(成员变量) 一个类中既不在方法体内,也不在程序块内定义的变量 类中 ...
- python3 之 linux命令实现
os.mkdir(path[, mode]) 以数字mode的mode创建一个名为path的文件夹.默认的 mode 是 0777 (八进制) # 创建多级目录 mkdir -p dir1/dir2 ...
- pidstat
统计系统上的某个进程占用的磁盘读写 pidstat -d -p pidNumber 3 -d 表示磁盘设备 -p 指定pid 3 表示每三秒刷新一次结果
- 用css实现图片在div内的垂直居中
已知一个div内有一个img,两者的高度均不知道,但图片的高度一定小于div的高度 代码如下: .box { /*非IE的主流浏览器识别的垂直居中的方法*/ display: table-cell; ...
- selenium webdriver 的事件处理
package www.zr.com; import org.openqa.selenium.WebDriver; import org.openqa.selenium.WebElement; imp ...
- 第二章 MySQL的安装与配置(待续)
·······
- 取当前时间,格式为,yyyy-mm-dd hh:mm:ss
function CurentTime() { var now = new Date(); var year = now.getFullYear(); //年 var month = now.getM ...
- Python内置函数二 (递归函数,匿名函数,二分法)
匿名函数 lambda() 语法: lambad 参数 : 返回值 def func(a,b): return a * b print(func(2,5)) a = lambda a ,b : a* ...
- HttpURLConnection连接网页和获取数据的使用实例
HttpURLConnection是java.net 里面自带的一个类,非常好用.虽然现在很多人用阿帕奇的HttpClient,但HttpURLConnection也是个不错的选择. 其实使用方法非常 ...
- HIVE UDF
基本函数 SHOW FUNCTIONS; DESCRIBE FUNCTION <function_name>; 日期函数 返回值类型 名称 描述 string from_unixtime( ...