首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
MCP广场
社区首页 >问答首页 >jQuery:检测单选按钮的更改(哪些已选中,哪些未选定),即使窗体字段是隐藏的

jQuery:检测单选按钮的更改(哪些已选中,哪些未选定),即使窗体字段是隐藏的
EN

Stack Overflow用户
提问于 2020-11-05 15:20:32
回答 1查看 36关注 0票数 0

在一组单选按钮中,我需要同时检测所选的收音机和哪个是(自动)取消选中的。

这里是一个简单的例子:

代码语言:javascript
运行
复制
<div class="radio-container">
  <input type="radio" name="choice" id="radio1" class="hidden-field">
  <label for="radio1">Label 1</label>
  <br>
  <input type="radio" name="choice" id="radio2" class="hidden-field">
  <label for="radio2">Label 2</label>
  <br>
  <input type="radio" name="choice" id="radio3" class="hidden-field">
  <label for="radio3">Label 3</label>
</div>

这里解释的解决方案的启发,我尝试了以下JS代码:

代码语言:javascript
运行
复制
var field = $('.radio-container').find('.hidden-field');

$(field).on('focus', function() {
  console.log("Previous: " + $('.hidden-field:checked').next('label').text());
});

$(field).change(function() {
  console.log("Selected: " + $('.hidden-field:checked').next('label').text());
});

这很好但是..。只有当单选按钮是可见的!

如果我应用以下CSS:

代码语言:javascript
运行
复制
.hidden-field {
  display: none;
}

对前面所选字段的检测不再运行(我也尝试使用visibility:hidden )。

我需要这样做,因为我在一个非常常见的"CSS手风琴解决方案“中使用了这种技术,在这个解决方案中,单击标签标签可以触发相应的隐藏单选按钮。

拜托,js有什么解决办法吗?

EN

回答 1

Stack Overflow用户

发布于 2020-11-05 15:38:39

尝试.on('change',...)并使用prop('checked')获取选中的值

票数 0
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/64700147

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档