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的原因,目前效果看来不错。

bootstrap框架下 单选按钮组的选中以及取值问题的更多相关文章

  1. input选中 和 select点击下拉选择获取选中选项的值

    1.input选中$('#checkBox').find('input').each(function(i){ if($(this).prop('checked')){//获取是否选中 并判断 $(t ...

  2. checkbox 选中、取值处理

    [1].[代码] checkbox 选中.取值处理 跳至 [1] ? 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 ...

  3. jQuery操作CheckBox的方法(选中,取消,取值)

    jQuery操作CheckBox的方法(选中,取消,取值). 代码: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional/ ...

  4. jquery操作select(选中,取值)

    最近工作中总出现select 和 option问题,整理一下,内容大部分源于网络资料 一.基础取值问题 例如<select class="selector"></ ...

  5. jQuery操作CheckBox的方法(选中,取消,取值)详解

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> <HTML> <HEAD ...

  6. Bootstrap框架下实现图片切换

    准备图片,把相关记录添加至数据库表中: 创建一个存储过程,获取所有记录: 在ASP.NET MVC专案中,部署Bootstrap环境...... 然后创建一个model: using System; ...

  7. jQuery bootstrap框架下重置下拉框选择

    前端页面中下拉选择框采用bootstrap-select美化,如下图:

  8. GridView 中绑定DropDownList ,下拉框默认选中Label的值

    在GridView中,我们 有时候要绑定值. 前台绑定的代码可以这样 <asp:TemplateField HeaderText="当前状态" ItemStyle-Horiz ...

  9. jquery 监听radio选中,取值

    $(document).ready(function(){ $("input[name=discount]").each(function(){ $(this).click(fun ...

随机推荐

  1. C++(实验三)

    Part 1 画布小球试验 程序源码 #include <iostream> #include "canvas.h" #include "ball.h&quo ...

  2. java中JScrollPane不显示水平滚动条的解决办法

    在JPanel中添加了表格,表格中对东西太多,需要水平滚动条滑动才能够完全找到所有数据,如果没有水平滚动条的话,数据堆积在一起,无法分开 做法是: 第一步:先将表格自动调整的状态给关闭掉:table. ...

  3. JAVA写接口傻瓜(%)教程(五)

    今天主要说一下在URL 中使用?传值的问题.在显式的使用get方法获取特点数据时,一般会通过?传递参数值,sevlert根据参数在数据库中对应的查找内容.所以,SQL语句需要拼接,要加上后面的参数.参 ...

  4. 深入理解CADisplayLink和NSTimer

    一.什么是CADisplayLink 简单地说,它就是一个定时器,每隔几毫秒刷新一次屏幕. CADisplayLink是一个能让我们以和屏幕刷新率相同的频率将内容画到屏幕上的定时器.我们在应用中创建一 ...

  5. raid卡的结构示意图

    raid卡的结构示意图,取自<大话存储>第124页 ROM:一般用FLash芯片做ROM,存放着初始化RAID卡必须的代码以及实现RAID功能所需的代码; XOR芯片:专门用来做RAID ...

  6. Cognos命名空间不可用

    1. 问题描述 启动Cognos失败,报错代码为0146. 2. 问题分析 namespace 配置有问题,检查configuration 3. 解决方案 如果检查不出问题,删除$COGNOS_HOM ...

  7. chrome google plugins

    Advanced REST client  Axure RP Extension for Chrome  Charset  Chrono下载管理器  Code Cola  CSS Sprite Gen ...

  8. python day1 之三级菜单的正确姿势

    看了几个同学有关三级菜单的实现,都是通过一级一级输出,是较为过程的实现.另外如果菜单(树形结构)更多级这样处理起来就比较麻烦了. 可以使用python强大的列表和字典,实现的更优美或简洁一些: 注:复 ...

  9. linux挂载数据盘步骤

    Linux添加新硬盘自动挂载硬盘的具体步骤 1.插入新硬盘,启动Linux服务器,使用fdisk -l 查看硬盘 #fdisk -l Disk /dev/sdb: 100GB, *********** ...

  10. vue.js笔记总结

    一份不错的vue.js基础笔记!!!! 第一章 Vue.js是什么? Vue(法语)同view(英语) Vue.js是一套构建用户界面(view)的MVVM框架.Vue.js的核心库只关注视图层,并且 ...