原生JS实现选中的radio变为未选中
需求如下,radio已经选中,再点击,取消选中状态。
效果如链接:演示地址
直接上代码:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
<input type="radio" name="sex" id="sex1" value="1"><label for='sex1'>男</label>
<input type="radio" name="sex" id="sex0" value="0"><label for='sex0'>女</label>
<script>
var selectID = null;
var els = document.querySelectorAll("[name=sex]")
for (el of els) {
el.addEventListener("click", function() {
if (selectID == this.id && selectID) {
this.checked = ""
selectID = null;
} else {
selectID = this.id;
}
})
} function GetRadioValue(radioName) {
var radios = document.getElementsByName(radioName);
for (var i = 0; i < radios.length; i++) {
var radio = radios.item(i);
if (radio.checked) {
return radio.value;
}
}
}
</script>
</body>
</html>
原生JS实现选中的radio变为未选中的更多相关文章
- (转)jquery serialize表单序列化,当radio或checkbox 未选中时,没有序列化到对象中的原因分析和解决方案 - ghostsf
相信很多人都用过jq的表单序列化serialize()方法,因为这能很方便地帮你把表单里所有的非禁用输入控件序列化为 key/value 对象,不需要你再去一个个地拼接参数了. 这是一个很好用的函数, ...
- Jquery Mobile下设置radio控件选中
问题: .html文件头部引入了: <script src="js/jquery.js"></script> <script src="js ...
- JS----checked----checked选中和未选中的获取
, allValue.length - 1); allValue = allValue.replace(/[ ]/g, ""); var checkedIds = allValue ...
- 在js中取选中的radio值
在js中取选中的radio值 <input type="radio" name="address" value="0" /> & ...
- jquery 设置checked="checked"无效,radio未选中。。
jquery 设置checked="checked"无效,radio未选中.. 最好还是使用.prop(),在jQuery1.6版本之前.attr存在一些bug.在1.6之后它会自 ...
- 折腾一天,获取下列多选框的所有选中值,原生js可直接通过obj.val()来获取,可jq不行,要通过循环取值来获取;
折腾一天,获取下列多选框的所有选中值,原生js可直接通过obj.val()来获取,可jq不行,要通过循环取值来获取;
- JS 如何获取radio或者checkbox选中后的值
废话不多说,直接上代码: 代码: <!DOCTYPE html> <html> <head> <meta charset="UTF-8"& ...
- 原生js实现选中所有的checkbox
<div class="con"> <input name='多选项名称' type='checkbox' value='' id="all" ...
- checked="checked"无效,radio未选中问题排查
在使用attr给元素设置属性的时候,但是显示在页面就是未选中,而且是只使用一两次是ok的,但是连着多使用就不起作用了,百度了下,发现遇到这个问题的人还蛮多的, 有人说,发现在jQuery1.6版本之后 ...
随机推荐
- Codeforces Round #369 (Div. 2) C. Coloring Trees(简单dp)
题目:https://codeforces.com/problemset/problem/711/C 题意:给你n,m,k,代表n个数的序列,有m种颜色可以涂,0代表未涂颜色,其他代表已经涂好了,连着 ...
- Python 函数的描述
函数 函数是带名字的代码块,用于完成具体的工作. 要执行函数定义的特定任务,可调用该函数.需要在程序中多次执行同一项任务时,你无需反复编写完成该任务的代码,而只需调用执行该任务的函数,让Python运 ...
- .Net Core+Angular6 学习 第二部分(创建Angular6项目)
. 创建angular6 前提: 需要安装nodejs以及angular的脚手架,Angular官网要求Angular6.0必须在node 8.x 和 npm 5.x 以上的版本才能正常使用. 我的版 ...
- web前端页面设计小笔记
input总是在点击的时候出现蓝色边框,这是input的默认属性,就算设置了border:none:也没有用! #解决方法:outline:none; 设置input框里的placeholder值得字 ...
- linux之正则
grep命令: -V 打印grep的版本号 -E 解释PATTERN作为扩展正则表达式,也就相当于使用egrep. -F 解释PATTERN作为固定字符串的列表,由换行符 ...
- Open Daylight integration with OpenStack: a tutorial
Open Daylight integration with OpenStack: a tutorial How to deploy OpenDaylight and integrate it wit ...
- 模拟setTimeOut
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8" ...
- vue添加页面键盘事件
我司开发项目,用的是vue+elementUI,做登陆页面的时候,点击enter键的时候要实现和点击登陆按钮一样的功能,所以就百度了一下,于是一通百度之后,就在点击按钮上面直接添加了@keyup.en ...
- python中的 uuid 模块使用示例
此模块提供不可变的 UUID 对象 (类 uuid) 和函数uuid1().uuid3().uuid4().uuid5(), 用于生成在 RFC 4122 中指定版本1.3.4和5UUIDs .如果你 ...
- django 模型操作
# 添加 Fruit.objects.create(name='Apple') # 更新 UserProfile.objects.filter(user=admin).update(**{'onlin ...