bootstrap框架下 单选按钮组的选中以及取值问题
1、业务功能:四个按钮只能选中一个,且默认选择水准4
先看代码。
<div class="btn-group" data-toggle="buttons">
<label class="btn btn-info">
<input type="radio" class="level_select" name="level_select" value="1">水准4(波/测)
</label>
<label class="btn btn-info">
<input type="radio" class="level_select" name="level_select" value="2">水准3(波/测)
</label>
<label class="btn btn-info">
<input type="radio" class="level_select" name="level_select" value="3">水准2(波/测)
</label>
<label class="btn btn-info">
<input type="radio" class="level_select" name="level_select" value="4">水准1(波/测)
</label>
</div>
这是查看了bootstrap的资料做的四个按钮的按钮组。
业务需求:默认选中水准4,查找bootstrap资料并没有找到合适的解决办法,后来在一篇博客中找到一个方法(实在抱歉,忘记博客的地址了= = )
在代码中加了active,代码如下:
<label class="btn btn-info active">
<input type="radio" class="level_select" checked name="level_select" value="1">水准4(波/测)
</label>
这样就实现了单选及默认选择水准4的页面效果。
2、关于取值。
我知道两种取值办法
(1)、var level_select= $("radio:checked").val();
这种取值方法是可以取值的,但是我的页面中有很多这种单选radio,为了避免歧义,所以我选择了下面这种取值。
(2)、var level_select= $(".level_select:checked").val();
这就是为什么input里面我加了class的原因,目前效果看来不错。
更多相关文章
- jQuery UI对话框调整大小关闭按钮
- ASP.NET下使用jQuery UI下的Dialog,服务器端按钮无响应的问题。
- 用jquery 绑定一个按钮click事件后,第一次点击后,一切正常,第二次点
- JQuery 表单验证按钮提交之前变色
- 使用jquery实现点击按钮弹出层和点击空白处隐藏层
- jquerymobile phonegap back按钮获取先前状态
- 9.1.4 前端 - HTML body标签 - 标题,段落,分割线,换行,特殊符号,列
- Jquery中的事件处理(自动触发事件,禁用按钮,悬停,失焦,滑动效果)
- 你能告诉为什么javascript函数没有在profile.php的提交按钮中执