JS 如何获取radio或者checkbox选中后的值
废话不多说,直接上代码:
代码:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>JS 如何获取radio或者checkbox选中后的值</title>
</head>
<body>
<p>单选框</p>
<input type="radio" name="sex" value="man" id="man" checked onclick="inputChecked()">
<label for="man">男</label>
<input type="radio" name="sex" value="female" id="female" onclick="inputChecked()">
<label for="female">女</label>
<p>多选框</p>
<input type="checkbox" name="fruits" value="apple" id="apple" checked onclick="inputChecked()">
<label for="apple">苹果</label>
<input type="checkbox" name="fruits" value="orange" id="orange" onclick="inputChecked()">
<label for="orange">橙子</label>
<script>
inputChecked();
function inputChecked() {
var inputSelect = document.getElementsByTagName('input');
var obj = {
radio: [],
checkbox: []
},
value = '';
for (var i = 0, len = inputSelect.length; i < len; i++) {
if (inputSelect[i].checked && inputSelect[i].type === 'radio') {
obj.radio.push(inputSelect[i].value);
value += '单选框:' + inputSelect[i].value + '\n';
}
if (inputSelect[i].checked && inputSelect[i].type === 'checkbox') {
obj.checkbox.push(inputSelect[i].value);
value += '多选框:' + inputSelect[i].value + '\n';
}
}
alert(value);
return obj;
}
</script>
</body>
</html>
JS 如何获取radio或者checkbox选中后的值的更多相关文章
- html中radio、checkbox选中状态研究(静下心来看,静下心来总结)
html中radio.checkbox选中状态研究(静下心来看,静下心来总结) 一.总结 1.单选框的如果有多个checked 会以最后一个为准 2.js动态添加checked属性:不行:通过 $(& ...
- 微信小程序 - 更改radio和checkbox选中样式
点击下载源码:示例-更改radio或checkbox选中样式
- 原生html、js手写 radio与checkbox 美化
原生html.js手写 radio与checkbox 美化 html <!DOCTYPE html> <html> <head> <meta charse ...
- checkbox 选中、取值处理
[1].[代码] checkbox 选中.取值处理 跳至 [1] ? 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 ...
- js如何获取asp.net服务器端控件的值(label,textbox,dropdownlist,radiobuttonlist等)
js如何获取asp.net服务器端控件的值(label,textbox,dropdownlist,radiobuttonlist等) 欢迎访问原稿:http://hi.baidu.com/2wixia ...
- jquery获取radio和select选中值
//jquery 获取radio选中值 <input type="radio" name="c_type" value="a" > ...
- html中radio、checkbox选中状态研究
我们在web页面开发中经常需要让单选框.复选框进行选中或者不选中的操作, 我们可以在元素中添加checked属性 或者添加checked="checked" 都可以让某个选项默认选 ...
- js,jquery获取下拉框选中的option
js获取select选中的值: var sel=document.getElementById("select1"); var index = sel.selectedIndex; ...
- layui 获取radio单选框选中的值
Layui 获取 radio的值,layui判断radio选中的单选值 layui form 表单获取radio选中的值 首先准备两个radio <input type="radio& ...
随机推荐
- 【CCPC-Wannafly Winter Camp Day3 (Div1) G】排列(水题)
点此看题面 大致题意:已知 \(p\)为\(n\)的一个排列,定义\(A(p)_i=min_{j=1}^ip_j\),若用\(q_i\)表示\(p\)第\(i\)小的前缀的长度(以值为第一关键字,下标 ...
- caffe RandomHue和RandomSaturation
https://www.cnblogs.com/wangyblzu/p/5710715.html HSV和RGB一样是一种图像的颜色模型,h表示色调,s表示饱和度 1.RandomHue void R ...
- 下载Xcode历史版本方法
1.打开链接:https://developer.apple.com/download/more 进入页面 2.在搜索框输入Xcode,回车搜索.如图,找到各种版本Xcode 搜索Xcode 3.双击 ...
- visual attention
The visual attention mechanism may have at least the following basic components [Tsotsos, et. al. 19 ...
- mac 开机白屏,卡进度条,无法进入系统
几个月前我的老Mac又一次的坏掉了,现在想起来就记录一下,哎,话说Apple的东西吧,好用是好用,一般都不会坏,质量保证,但是如果一旦坏了,那就是大问题!(坏了第一时间就应该打电话给apple客服小姐 ...
- ECMAscript6(ES6)新特性语法总结(一)
ES6/ES2015,,在ES5的基础上扩展了很多新的功能,在使用的时候要慎重,因为有一部分js代码在部分浏览器是不兼容的,但是所有写在服务器端的代码基本上都支持ES6的写法. 新特性: 一.开启严格 ...
- SQL关于删除的三个语句:DROP、TRUNCATE、 DELETE 的区别。
DROP: DROP TABLE test; 删除表test,并释放空间,将test删除的一干二净. TRUNCATE: TRUNCATE test; 删除表test里的内容,并释放空间,但不删除表的 ...
- VM虚拟机里的Ubuntu系统怎么设置屏幕分辨率
说白了就是安装VMWare tools工具,步骤如下: 1)在VMWare中启动ubuntu虚拟机 2)在VMWare中:右键单击启动虚拟机,点击[安装vmware tools] 3)在ubuntu中 ...
- javascript中string对象方法中的slice、substring、substr的区别联系
1.slice.substring.snustr均属于String的对象方法,用于截取或提取字符串片段,三者均布破坏原先的字符串,而是以新的字符串返回被提取的部分. <script> va ...
- HDU3853 概率DP
LOOPS Homura wants to help her friend Madoka save the world. But because of the plot of the Boss I ...