原生js控制单选框选中后单次单击取消选中

最新推荐文章于 2024-05-09 15:49:11 发布
原创 最新推荐文章于 2024-05-09 15:49:11 发布 · 2.5k 阅读 · 1 ·
CC 4.0 BY-SA版权
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。

本文介绍了一个简单的HTML示例，展示了如何使用JavaScript控制HTML表单中性别选项的状态。通过为单选按钮添加点击事件监听器，实现了选择状态的切换，并保持了用户的选择。
<html>
<body>
<input type="radio" id="r1" name="r" v=0 onclick="doClick(this)" />男
<input type="radio" id="r2" name="r" v=0 onclick="doClick(this)" />女
</body>
<script>
    function doClick(obj){
        var myv=obj.attributes["v"].nodeValue;
        if (myv==0){
obj.setAttribute("v",1);
              obj.checked=true;
        }else{
obj.setAttribute("v",0);
              obj.checked=false;
        } 
    }
</script>
</html>
前端速成教程（HTML、CSS、JS、Vue…）
https://www.hyperplasma.top
05-06 3885
JavaWeb开发 SSM框架基础 前端速成——HTML、CSS、JS、Vue、Ajax、前端工程化。Web技术教程：W3Schoo。Vue是一套前端框架，免除原生JavaScript中的DOM操作，简化书写。基于MVVM（Model-View-ViewModel）思想，实现数据的双向绑定，将编程的关注点放在数据上。Vue-cli是Vue官方提供的一个脚手架，用于快速生成Vue项目模板。
Element源码分析系列7-Select(下拉选择框)
weixin_34067102的博客
08-24 2950
简介 Element的下拉选择器示意图如下 确实做的很漂亮，交互体验非常好，html有原生的选择器&lt;select&gt;，但是太丑了，而且各浏览器样式不统一，因此要做一个漂亮且实用的下拉选择器必须自己模拟全部方法和结构，Element的下拉选择器代码量非常大，仅select.vue一个文件就快1000行，而且里面是由Element的其他组件组合而成，算上其他组件的话，又得加上1000行，最...
利用原生js和jQuery实现单选框的勾选和取消操作
祥哥的专栏--每一天
08-30 1万+
根据一下的Demo，大概就可以看的明白 Demo:<html> <head> <script src='jquery-1.9.1.min.js'></script> <script> window.onload = function(){ var dom_a = document.getElementById('a1'); var dom_b = docum
单选按钮选中后取消
weixin_46389242的博客
05-09 976
单选按钮选中后可取消，解决radio代码添加了选中效果，页面没有选中效果
js基础 【操作单选按钮选中和取消】
姗姗的博客
07-06 2223
<body> <input type="radio" id="radio"> <input type="button" value="选中" id="btn1"> <input type="button" value="取消" id="btn2"> <script> var oRadio = document.getElemen...
三种取消选中单选框radio的方法
12-09
本文提供了三种取消选中radio的方式，代码示例如下: 本文依赖于jQuery,其中第一种，第二种方式是使用jQuery实现的，第三种方式是基于JS和DOM实现的。 <!DOCTYPE HTML> <html> <head> <title>单选按钮取消选中的三种方式</title> [removed] [removed] [removed] $(function(){ // var $br
单选按钮选中之后再次点击取消选中状态
weixin_46389242的博客
10-10 1471
单选按钮选中之后再次点击取消选中状态。
HTML5、CSS、JS基础
qq_49101841的博客
03-03 2719
学习笔记
Python基础 3.5 HTML CSS JS 和 JQuery
Retro暂留
01-18 491
3.5 Html 和 CSS基础 3.5.1 html 1.介绍 ​ HTML 的全称为：HyperText Mark-up Language, 指的是超文本标记语言。 标记：就是标签, <标签名称> </标签名称>, 比如: <html></html>、<h1></h1> 等，标签大多数都是成对出现的。 所谓超文本，有2个意义 网页中包含除了文本以外的数据内容，超越文本 它还可以从一个网页跳转到其他网页 2.作用 ​ 开发网页的语
Javascript的新领域——动态图片处理之SVG
热门推荐
JavaScript
10-17 1万+
近三年前的一篇旧文，虽然在浏览器和相关技术标准方面有过时之处，但总体上对概念的理解、开发的思路和代码样例仍然有参考价值。背景当Javascript被Netscape公司发明出来时，它被用来做一些琐细的事情，比如校验表单、计算日期、提示用户；随着Web的迅速发展，这种轻巧而灵活的语言被委以越来越多的任务，动态地修改页面内容，一致地处理事件，甚至无刷新地和服务器交互。然而，与传统的客户端编程相比，Ja
js取消单选按钮选中示例代码
10-26
取消单选按钮选中的方法有很多，下面为大家详细介绍下使用js是如何实现的，感兴趣的朋友不要错过
单选按钮(radio)的取消与选中
07-10
js控制单选按钮(radio)的取消与选中，javascript单选按钮
js实现checkbox的radio单选效果，且可取消选择
02-19
js实现checkbox的radio单选效果，且可取消选择
单选框单击取消选中
AE_yang的博客
10-28 7858
单选框，选中之后是无法取消选择的，必然有选中项。 如果为必填项，不会存在问题，实际情况是：有可能是非必填项，现在想取消选择。 客户实际是配置了一项‘未知’来表示无值的情况。 有如下考虑： 1.改为下拉框，添加一项‘请选择’，特定值，后台过滤。 2.改为多选框，通过js限制只能选一项。 3.单击选中的单选框，取消选中。 想当然的代码 1 2 3 4 5 $("input[type='radio']").click(functio..
js下拉列表单选可多选，再次点击取消选中-事件委托-单独事件
JackieDYH的博客
04-08 959
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title></title> <style type="text/css"> * { margin: 0; padding: 0; } .wrap { ...
js表单全选和取消全选
SqlloveSyn的博客
08-11 1046
1. 全选框选中，下边的所有单选框也都选中，全选框取消选中，下边的单选全不选中。如果全选选中情况下，下边的取消选中一个，哪上边的全选框就不选中。2. 第二就是下边的单选框一个一个选中，等到下边的单选框全部选中后，上边的全选框选中。同样取消一个单选，全选就不选中。这是一个全选和取消全选的功能，最上边的是全选框，下边的是单选框。...
取消选中单选框radio的三种方式
weixin_33958585的博客
12-21 3384
作者: 铁锚 日期: 2013年12月21日 本文提供了三种取消选中radio的方式，代码示例如下: 本文依赖于jQuery,其中第一种，第二种方式是使用jQuery实现的，第三种方式是基于JS和DOM实现的。 <!DOCTYPE HTML> <html> <head> <title>单选按钮取消选中的三种方式</titl...
js原生单选框radio点击选中
最新发布
09-14
JavaScript原生的单选框（radio）点击选中是指用户通过点击单选框（radio）的标签部分，使得该单选框被选中。通常情况下，单选框的选中是由HTML的`<input>`标签来控制的，其`type`属性被设置为`radio`。为了通过...
评论 1
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值