使用Jquery隐藏radio单选框，获取Bootstrap Radio Group当前选中的单选框的值

最新推荐文章于 2026-05-11 11:46:42 发布

原创最新推荐文章于 2026-05-11 11:46:42 发布 · 1.9k 阅读

1 ·

本内容遵循CC 4.0 BY-SA版权协议

标签

#隐藏单选框 #隐藏RADIO #隐藏单选框小圆圈 #隐藏单选框图标

收录于

本文介绍如何使用Jquery从按钮组形式的单选框中获取当前选中的值，通过示例展示了如何利用Jquery的选择器来实现这一功能。

使用Jquery隐藏radio单选框：

使单选框变成按钮组形式

<div class="btn-group" id="color" data-toggle="buttons">
       <label class="btn btn-default">
         <input type="radio" class="toggle" value="1"> 红色
       </label>
       <label class="btn btn-default">
         <input type="radio" class="toggle" value="2"> 绿色
       </label>
       <label class="btn btn-default">
         <input type="radio" class="toggle" value="3"> 蓝色
       </label>
</div>

现在，我需要使用Jquery来获取当前选中的颜色，怎么操作呢？

在bootstrap里，button group 也是用radio来模拟实现的，它封装实现了实际的radio操作，所以我们可以直接用Jquery的选择器来获取radio的选中值，如下：