html实现radio单选钮可取消选中的功能

清疚 2022-12-29 06:47 711阅读 0赞

### 亲测有效！ ###

是从一位大佬那儿看到的，具体链接搞丢了。原创者看到可私我加上版权

### 先上效果图： ###

![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80NDE3MTc1Nw_size_16_color_FFFFFF_t_70]  
![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80NDE3MTc1Nw_size_16_color_FFFFFF_t_70 1]

//html实现radio单选钮取消选中
      $('#Login .autoLogin input:radio').click(function(){ 
        var domName = $(this).attr('name');
        var $radio = $(this);
        if ($radio.data('waschecked') == true){ 
          $radio.prop('checked', false);
          $("input:radio[name='" + domName + "']").data('waschecked',false);
        } else { 
          $radio.prop('checked', true);
          $("input:radio[name='" + domName + "']").data('waschecked',false);
          $radio.data('waschecked', true);
        }
      });

[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80NDE3MTc1Nw_size_16_color_FFFFFF_t_70]: /images/20221120/6d345c990163475bb2d464e6d8778025.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80NDE3MTc1Nw_size_16_color_FFFFFF_t_70 1]: /images/20221120/052ee10893fb44bd98962e1551d3a2a5.png

发表评论取消回复

表情：

评论列表（有 0 条评论，711人围观）

还没有评论，来说两句吧...

相关阅读

相关设置第一个单选按钮radio选中

置第一个Radio为选中值： $('input:radio:first').attr('checked', 'checked'); $('input:...

墨蓝/ 2024年04月20日 08:46/ 0 赞/ 79 阅读

相关单选框radiobutton的选中取消

选框radiobutton不同于复选框checkbox，一旦被点击，就总有一个会被选中，不能取消。如果要将单选框恢复为一个都没有被选中的原始状态，应该怎么办？这时就要借助...

﹏ヽ暗。殇╰゛Y/ 2024年04月19日 15:41/ 0 赞/ 73 阅读

相关 jQuery动态控制单选框选中，实现radio单选框选中后触发事件。prop()选中，取消事件判断。

$('input[name="IS_BREAK"][value="0"]').prop('checked',true); <div class="form-g

深碍√TFBOYSˉ_/ 2023年10月17日 21:40/ 0 赞/ 57 阅读

相关 radio单选框的选中与取消（超详细讲解！）

一、前情提要刚开始想做的效果是这样：我操作了checkbox复选框，radio单选框的状态会随之变化。进而引出一系列问题，如：1、radio单选框选中了如何取消，取消了

快来打我*/ 2023年02月20日 10:56/ 0 赞/ 3443 阅读

相关 html实现radio单选钮可取消选中的功能

亲测有效！是从一位大佬那儿看到的，具体链接搞丢了。原创者看到可私我加上版权先上效果图： ![在这里插入图片描述][watermark_type_ZmFuZ3p

清疚/ 2022年12月29日 06:47/ 0 赞/ 712 阅读

相关 html 单选按钮(input radio)

`<input>` 的 radio 类型元素默认渲染为小型圆圈图表，填充即为激活，类似于之前描述额复选框（checkbox）类型。单选按钮允许你选择单一的值来提交表单。 <t

雨点打透心脏的1/2处/ 2022年10月27日 01:39/ 0 赞/ 14 阅读

相关点击单选按钮radio后面的文字即可选中单选按钮

http://blog.csdn.net/w\_\_yi/article/details/7527926 关键字：radio 单选按钮文字选中有时候我们在

我就是我/ 2022年02月13日 08:39/ 0 赞/ 406 阅读

相关单选radio

![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ub

Dear 丶/ 2022年01月27日 00:11/ 0 赞/ 294 阅读

相关 uni-app radio-group 中 radio 取消选中

问题背景我们在用 uni-app 开发前端项目时，经常会通过 radio 组件，并结合单项选择器组件 radio-group来实现单选效果。官方文档说明的也比较清楚，原...

朱雀/ 2021年03月30日 11:09/ 0 赞/ 3694 阅读

相关 HTML input radio 单选按钮

`< input>` 标签 type 属性值设置为 "radio"，即可创建一个单选按钮。既然是单选按钮，按钮之间通常互斥，同一时刻只能有一项处于选中状态。 ...

小灰灰/ 2020年05月15日 17:24/ 0 赞/ 1069 阅读