radio----单选按钮组（在一个页面实现多组单选按钮）

单选按钮组的html实现(bootstrap3.0库)

几个注意的点：

• 要让按钮显示激活状态，label的class里添加active属性
• 要使单选按钮真正具有激活状态，在之后js判断中能读取到，在input里加入checked属性：<input ... checked...
• 一般在一个页面内，定义单选按钮组，肯定的只有一个能被选中，若是在一个页面内有多个单选按钮组，比如问卷小调查啥的，要有多个单选按钮组，将input里不同按钮组name命名要不同，相同按钮组name要相同。

<h3>group1</h3>
<div id="group1">
	<div class="btn-group" data-toggle="buttons">
	<label class="btn btn-info active">
	<input type="radio" id="option1" checked name="radio-group1" value="1">option1
	</label>
	<label class="btn btn-info">
	<input type="radio" name="radio-group1" value="1">option2
	</label>
	</div>
</div>

<h3>group2</h3>
<div id="group2">
	<div class="btn-group" data-toggle="buttons">
	<label class="btn btn-info active">
	<input type="radio" checked name="radio-group2" value="1">option1
	</label>
	<label class="btn btn-info">
	<input type="radio" name="radio-group2" value="1">option2
	</label>
	</div>
</div>

可以在菜鸟在线编辑器试试

取值（jQuery）

几种方法

• .is(':checked'): //所有版本:true/false//!!!冒号
• .attr(‘checked’): //看版本1.6+返回:”checked”或”undefined” ;1.5-返回:true或false

下面js框输入换换试试：

//alert($('#option1').attr("checked"))
 
//alert($('#option1').is(':checked'))

alert($($('#group1 :input').get(0)).is(":checked"))

alert($($('#group1 :input').get(1)).is(":checked"))

参考：input type=“radio” jquery判断checked的三种方法