html中radio值的获取、赋值、注册事件示例详解
2014-05-13 10:42
691 查看
1,radio分组
只要name一样,就是一组的,即一组中只能选择一个,如下:
效果如下:
2,获取选中的radio节点
使用jquery可以很方便做到,先选择group,然后过滤出checked的,如下:
3,选中一个radio节点
使用jquery设置checked属性:
4,去选中一个radio节点
移除checked属性:
这样做的结果可能造成一组radio中没有一个处于选中状态。
5,注册选中去选中事件
还是使用jquery的on函数来注册change事件,如下:
这样只要group1中任何一个有选中的,就会触发函数。
只要name一样,就是一组的,即一组中只能选择一个,如下:
<span>group1:</span> <input type="radio" id="radio1" checked="checked" name="group1" />radio1 <input type="radio" id="radio2" name="group1" />radio2 <input type="radio" id="radio3" name="group1" />radio3 <span>group2:</span> <input type="radio" id="radio4" checked="checked" name="group2" />radio4 <input type="radio" id="radio5" name="group2" />radio5 <input type="radio" id="radio6" name="group2" />radio6
效果如下:
2,获取选中的radio节点
使用jquery可以很方便做到,先选择group,然后过滤出checked的,如下:
var group1 = $("[name='group1']").filter(":checked"); console.log(group1.attr("id"));
3,选中一个radio节点
使用jquery设置checked属性:
$("#radio2").attr("checked", "checked");
4,去选中一个radio节点
移除checked属性:
$("#radio1").removeAttr("checked");
这样做的结果可能造成一组radio中没有一个处于选中状态。
5,注册选中去选中事件
还是使用jquery的on函数来注册change事件,如下:
$("[name='group1']").on("change", function (e) { console.log($(e.target).val()); } );
这样只要group1中任何一个有选中的,就会触发函数。
相关文章推荐
- html中的特殊符号表示法
- html幻灯效果页面
- <!DOCTYPE html PUBLIC……>的组成解释
- 数据转换服务-HTML转换技术
- HTML 和 XHTML 区别
- html 布局
- html 选择器之属性选择器
- 《网页开发手记》学习笔记之HTML概述
- html 4 浮动 清除浮动(两种方法注意)
- html 3
- html 2
- html 1
- html test
- Html Table
- HTML <a> 标签的 target 属性
- HTML <a> 标签的 target 属性
- HTML <i> 标签
- html 标签 《Meta》 十大功用
- HTML <meta> 标签
- 文档附件在线预览――HTML Filter数据转换器