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的原因,目前效果看来不错。
bootstrap框架下 单选按钮组的选中以及取值问题的更多相关文章
- input选中 和 select点击下拉选择获取选中选项的值
1.input选中$('#checkBox').find('input').each(function(i){ if($(this).prop('checked')){//获取是否选中 并判断 $(t ...
- 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 ...
- jQuery操作CheckBox的方法(选中,取消,取值)
jQuery操作CheckBox的方法(选中,取消,取值). 代码: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional/ ...
- jquery操作select(选中,取值)
最近工作中总出现select 和 option问题,整理一下,内容大部分源于网络资料 一.基础取值问题 例如<select class="selector"></ ...
- jQuery操作CheckBox的方法(选中,取消,取值)详解
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> <HTML> <HEAD ...
- Bootstrap框架下实现图片切换
准备图片,把相关记录添加至数据库表中: 创建一个存储过程,获取所有记录: 在ASP.NET MVC专案中,部署Bootstrap环境...... 然后创建一个model: using System; ...
- jQuery bootstrap框架下重置下拉框选择
前端页面中下拉选择框采用bootstrap-select美化,如下图:
- GridView 中绑定DropDownList ,下拉框默认选中Label的值
在GridView中,我们 有时候要绑定值. 前台绑定的代码可以这样 <asp:TemplateField HeaderText="当前状态" ItemStyle-Horiz ...
- jquery 监听radio选中,取值
$(document).ready(function(){ $("input[name=discount]").each(function(){ $(this).click(fun ...
随机推荐
- C# T 泛型类,泛型方法的约束条件用法
class A<T> where T:new() 这是类型参数约束,where表名了对类型变量T的约束关系.where T:A 表示类型变量是继承于A的,或者是A本省.where T: n ...
- css过渡
过渡transition是一个复合属性 例子1 .example{ width: 200px; height: 100px; background-color: blanchedalmond; tra ...
- maven中央仓库地址(支持db2,informix等)
maven中央仓库地址(以下设置写在pom.xml文件里): <repositories> <repository> <id>nexus</id> &l ...
- C语言课设——电影院选票系统
C语言课设--电影院选票系统 1.课题介绍 大家都爱看电影,现请参考一个熟悉电影票预订系统,实现C语言版的订票系统.了解订票如何实现的.系统主要有2类用户:管理员用户和顾客用户. 管理员用户 1.电影 ...
- 论文选读二:Multi-Passage Machine Reading Comprehension with Cross-Passage Answer Verification
论文选读二:Multi-Passage Machine Reading Comprehension with Cross-Passage Answer Verification 目前,阅读理解通常会给出 ...
- CSS3特性
2018-08-20 CSS3:用于控制网页的样式和布局 1.transform:rotate(30deg); CSS3 模块 选择器 盒模型 背景和边框 文字特效 2D/3D转换 动画 多 ...
- Haxe东游记(上)part1.5:roadmap
part1.6 = 常用API参考 1.5.7 -> 官方手册目录/总结/中文化 1.8 -> 官方示例/讲解/总结 1.5.6-> haxe整体结构/解析/综述 part2 = 中 ...
- spring中的AOP实验(二)
软件151 王帅 1.目标对象的接口:IStudent.java package com.dragon.study; public interface IStudent { ...
- Mysql 源码:关于innodb中两次写的探索
转载自:http://www.cnblogs.com/bamboos/p/3553703.html?utm_source=tuicool&utm_medium=referral 两次写可以说是 ...
- 1.2 JAVA多线程实现
线程和进程 进程:是执行中一段程序, 进程是系统进行资源分配和调度的一个独立单位. 线程:比进程更小的能独立运行的基本单位,单个进程中执行中每个任务就是一个线程.线程是进程中执行运算的最小单位. Th ...