radio checked不起作用的原因

最新推荐文章于 2023-12-13 16:55:29 发布
转载 最新推荐文章于 2023-12-13 16:55:29 发布 · 280 阅读 · 0 ·
CC 4.0 BY-SA版权
原文链接：http://www.cnblogs.com/toSeeMyDream/p/4410473.html

本文探讨了一个关于HTML表单控件可见性的具体问题，即radio按钮在不同表格单元格（td）内的表现差异。当radio按钮位于表格单元格内时，其checked属性能够正常工作，而直接放在<tr>标签内时则失效。文章通过实例对比展示了这一现象，并提供了源代码供读者参考。

摘要生成于 C知道 ，由 DeepSeek-R1 满血版支持， 前往体验 >

 <table  id="approveTable">
                    <tr>
                       <td>
                        <input  type="radio"   name="action"  value="1"  checked="checked"   onclick='$("#selectRow").css("visibility","visible");'/>成功
                        </td>
                        <td>
                        <input  type="radio"   name="action"   value="0"  onclick='$("#selectRow").css("visibility","hidden");'/>失败
                        </td>
                    </tr>
</table>

这种方式checked是起作用,但如果不把控件包在td中就不起作用了,如下：

 <table  id="approveTable">
                    <tr>
                       
                        <input  type="radio"   name="action"  value="1"  checked="checked"   onclick='$("#selectRow").css("visibility","visible");'/>成功
                        
                        <input  type="radio"   name="action"   value="0"  onclick='$("#selectRow").css("visibility","hidden");'/>失败
                        
                    </tr>
</table>

 

转载于:https://www.cnblogs.com/toSeeMyDream/p/4410473.html

layui给radio添加checked属性不起作用
向宇
11-06 2670
今天用layui做一个简单的radio单选框的选中出错,页面html标签明明已经添加了checked属性,但是没有起到选中效果 经过百度,都是说需要加上 form.render(); 重新渲染一下就好了,试了一下还是不行,甚至报了个没找到form的错误,说明百度上大多数的人都是复制粘贴怪,并没有自己亲自测试 后来发现,其实只要加上layui.form.render()就可以了 如果您觉得...
jquery中radio checked问题
12-01
这种方法直接访问DOM元素的`checked`属性，但jQuery对象并不直接支持这个属性，所以需要通过索引访问原始DOM元素，例如 `$("#ISOK1")[0].checked = true;` 2. 使用`.attr()` 方法： ```javascript $("#ISOK1")....
radio设置属性checked属性不生效
热门推荐
感恩、奋进、自信
12-03 2万+
在jquery中，通过点击事件设置radio的checked属性不生效。1、html &lt;div id="weChatSignIn"&gt; &lt;input type="radio" name="nameList" value="微信签到用户抽奖" id='wechat'/&gt;微信签到用户抽奖 &lt
vue中radio根据动态值绑定checked无效
Roriring的博客
09-30 4573
1.问题分析： 在vue之前，我们想要获取某一组（设置相同的name属性）radio的选中状态是通过name属性获取，判断input的checked是true还是false，但是当列表中有多组（动态获取）就显得很乏力；vue出现后我们可以通过v-model很巧妙的完成。 2.vue中分析（完成代码请看后面） <input :name="item.COLUMN_CODE" :...
【ElementUI】【Vue】el-Radio失效，无法切换选中效果
陶洲川的博客
02-26 1万+
一、问题 1.1、环境 电脑环境：Windows 10； 开发工具：IntelliJ IDEA； 数据库环境：Redis 3.2.100 JDK环境: Jdk1.8； 1.2、问题 【Vue】【ElementUI】为什么使用el-radio 标签失效？ 使用el-radio标签，点击图中的【审核不通过】圆形单点框，没有反应，还是默认选中【审核通过】。 二、解答 1、这里有个坑，就是ElementUI和Vue.js框架配合使用的时候，不支持连点。 错误方法： //3 审核 reviewSys
radio设置属性checked属性不生效问题汇总
heerey525
03-20 7766
情况是这样的： 通过js动态设置radio添加checked属性，在控制台看到已经存在checked，但是页面显示没有选中。 分为两种情况来讲 情况一：用attr添加，removeAttr移除（即为我所遇到的问题） 解决方案：用prop和removeProp代替 原因：jQuery版本较低，attr存在这样的缺陷 情况二：在同页面除该组radio外的其他组radio设置name相同值...
IE中radio 或checkbox的checked属性初始状态下不能选中显示问题
09-05
这个属性与`checked`类似，但在页面初始化时起作用，即在DOM加载完成后，元素的状态会根据`defaultChecked`的值来设定。因此，要确保`radio`或`checkbox`在IE中初始状态下被选中，可以使用以下代码： ```javascript...
layui 实现自动选择radio单选框(checked)的方法
10-16
在这篇文章中，我们关注的是使用Layui框架来实现自动选择单选框（radio）的功能，特别是设置单选框的“checked”属性。 首先，我们要了解的是，在HTML中，单选框的“checked”属性表示该单选框默认被选中。如果我们...
单选按钮radio用checked=“checked“没效果怎么办
一峰的技术博客
12-11 1215
用了后台thymeleaf框架和前端pintuer框架搭建的一个按钮，作用于点击修改的时候性别会默认选中，用check没效果，不知道什么原因，但发现可以在class下动手，于是就有了这样的代码， <div class="form-group"> <div class="label"> <label>Gender</label> </div> <div class="field
vue项目中radio/checkbox无法选择的问题
theScoreONE的博客
01-24 3811
之前写过一遍《vue通过后端返回值动态生成表单及动态表单的数据提交 》提交动态表单数据没有问题。但是要更新数据，请求后端数据渲染表单并赋值后，发现radio/checkbox等组件无法手动选中，排查知道原因是双向绑定失效 一、复现问题 1、正常的情况 <van-checkbox-group v-model="result" :max="2"> <van-checkbox name="a">复选框 a</van-checkbox> <van-checkbo
关于checkbox/radio选中不选中HTML不变化
wuxhyou的专栏
09-24 3647
问题：在页面中，有checkbox和radio，当你从选中状态发生改变时，它们的HTML不变化； 解决：这个问题很让人头疼和不解，最后没有办法 ，我只能用js来改变html的内容，也就是改变控件的checked的值，最终影响Html，实在是没有办法，看到这篇文章的人如果有更好的办法请分享一下
radio单选框checked=checked却不显示选中
Allen_Swfit的博客
12-13 963
radio checked=checked但是不显示选中
单选框(radio)多选框（checkbox）选中不好使
授人以渔的博客
07-02 265
//好用情况最多的 document.getElementById("ID").checked = true; //有时候不好使！写法正确 $("#"+ID).attr('checked', true);
小程序中的radio----单项选择时的小坑
julystroy的博客
04-26 3643
首先看下官方文档 <radio-group class="radio-group" bindchange="radioChange"> <label class="radio" wx:for="{{items}}"> <radio value="{{item.name}}" checked="{{item.checked}}" /> {{it...
设置input checked 失效 解决方案
zlzbt
07-09 4460
小编在写代码的过程中用到了input标签，然而小编简单的以为使用老套的jquery的attr()即可，没想到入了一个大坑，审查匀速时即使看到 <input type ='radio' checked='checked'/> 依然没有起到选中的效果，小编就疯狂百度了一下，学习到了jQuery 1.6新增函数 主要就是将 attr() 换成prop 即可 prop()函数 下面...
radio checked 没有反应
江城宴的博客
07-27 2135
基本都是jquery的版本原因造成attr方法不能正常使用。为了解决这一问题 jquery引入了prop方法。用法基本和attr差不多。 var i=1； $("input[name='matter']").each(function() { if ($(this).val() == i) {
radio checked name
最新发布
02-10
### 如何通过 `name` 属性检查 Radio 按钮状态 为了验证具有相同名称 (`name`) 的一组单选按钮 (Radio Button)，可以使用 JavaScript 来遍历这些元素并检测哪个被选中。下面是一个详细的实现方法： #### 使用原生 JavaScript 实现 可以通过获取表单中的所有同名单选按钮，再逐一判断其是否处于已选中(`checked`)状态。 ```javascript function getCheckedRadioButton(name) { const radios = document.getElementsByName(name); let selectedValue; Array.prototype.forEach.call(radios, function(radio) { if (radio.checked === true) { selectedValue = radio.value; } }); return selectedValue ? selectedValue : null; } ``` 此函数接收一个参数作为要查询的单选按钮组的名字，并返回当前选定项的值；如果没有选项被选中，则返回 `null`[^1]。 当页面加载完成或者特定事件触发时调用上述定义的方法来获取用户的选择情况: ```html <form id="exampleForm"> <input type="radio" name="option" value="first">First<br> <input type="radio" name="option" value="second">Second<br> <input type="radio" name="option" value="third">Third </form> <script> window.onload = function() { console.log(getCheckedRadioButton('option')); // 输出第一个默认选中的value或null }; </script> ``` 对于样式调整方面，在某些情况下可能需要移除内边距(top padding)以使标签文字基线更好地对齐其他组件，这属于 CSS 布局优化的一部分[^2]。 此外，如果希望动态启用/禁止单选按钮，可利用如下提供的辅助函数来进行操作[^3]: ```javascript // 动态设置单选按钮不可用 document.querySelector('[name=option]').disabled = true; // 或者批量处理多个单选按钮 const optionsRadios = document.querySelectorAll('[name=option]'); optionsRadios.forEach(option => option.disabled = true); // 启用指定单选按钮 enableElement(document.querySelector('[name=option][value="second"]')); ```
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值