单选框


默认点击文字也会勾选,不需要在外面包一层label
普通样式代码
<input type="radio" class="fill" name="radio" />单选框未选中
<input type="radio" class="fill" name="radio" checked />单选框选中
<input type="radio" class="fill" name="radio" disabled="disabled" />单选框未选中(只读)
<input type="radio" class="fill" checked disabled="disabled" />单选框选中(只读)
高级样式代码
<input type="radio" class="svg" name="radio2" />单选框未选中
<input type="radio" class="svg" name="radio2" checked />单选框选中

伪单选代码
<!--在label标签上添加class即可(选中和未选中的class不要加)-->
<label class="button"><input type="radio" class="fake" name="radio3" value="1" checked/>已选中</label>
<label class="button"><input type="radio" class="fake" name="radio3" value="2"/>未选中</label>

<script>
	javaex.fakeRadio({
		name : "radio3",
		uncheckClass : "wathet", // 未选中时往label标签添加的class
		checkedClass : "blue", 	// 选中时往label标签添加的class
		isInit : true,			// 初始化是否自动调用回调函数
		callback : function(rtn) {
			// 回调函数,返回选中的值(虽然提供了回调函数,但是依然建议用jquery的原生方式取值)
			console.log(rtn.val);
		}
	});
	
	$(':radio[name="radio3"]').change(function() {
		alert($(this).val());
	});
</script>
参数说明(使用属性默认值时,可以缺省该属性)
序号 属性名 默认值 说明
1 name radio的name属性
2 uncheckClass 未选中时往label标签添加的class
3 checkedClass 选中时往label标签添加的class
4 isInit false 初始化是否自动调用回调函数
5 callback 返回选中的值(虽然提供了回调函数,但是依然建议用jquery的原生方式取值)
演示