用 Javascript 验证表单(form)中的单选(radio)值


Posted in Javascript onSeptember 08, 2009

本文介绍了一个较为通用的获取 radio 值的方法,希望对新手有用。

<script type="text/javascript"> 
// 说明: 用 Javascript 验证表单(form)中的单选(radio)值 
// 作者: CodeBit 
function getRadioValue(radio) 
{ 
if (!radio.length && radio.type.toLowerCase() == 'radio') 
{ return (radio.checked)?radio.value:''; } 
if (radio[0].tagName.toLowerCase() != 'input' || 
radio[0].type.toLowerCase() != 'radio') 
{ return ''; } 
var len = radio.length; 
for(i=0; i<len; i++) 
{ 
if (radio[i].checked) 
{ 
return radio[i].value; 
} 
} 
return ''; 
} 
</script>

radio 和 checkbox 一样,都是 name 相同,值有多个,在获取 radio 值的时候,我们不能按照普通文本框 .value 的方式,而是要判断哪个被选中了。

当一组 radio 有多个选项时,我们可以通过循环,以 radio[i] 的方式判断某个选项是否被选中来返回值,但是当一组 radio 只有一个选项时,获取值的方式又有变化,代码中以 return (radio.checked)?radio.value:''; 这样的方式直接判断是否选中,然后返回对应值。

上面的代码传入的参数是 radio 对象,如:

var radioTest = document.forms['testForm'].elements['radioTest']; 
if (getRadioValue(radioTest) == '') 
{ ...... }

根据判断结果执行你想要的操作。
Javascript 相关文章推荐
Javascript 验证上传图片大小[客户端]
Aug 01 Javascript
javascript实现的HashMap类代码
Jun 27 Javascript
详解jQuery移动页面开发中的ui-grid网格布局使用
Dec 03 Javascript
JavaScript判断数字是否为质数的方法汇总
Jun 02 Javascript
Active控件问题小结(附解决办法)
Jun 09 Javascript
微信小程序 视图容器组件的详解及实例代码
Jan 19 Javascript
js分页之前端代码实现和请求处理
Aug 04 Javascript
微信小程序中添加客服按钮contact-button功能
Apr 27 Javascript
详解如何在Angular优雅编写HTTP请求
Dec 05 Javascript
JavaScript变量提升和严格模式实例分析
Jan 27 Javascript
微信小程序中限制激励式视频广告位显示次数(实现思路)
Dec 06 Javascript
vue中如何添加百度统计代码
Dec 19 Vue.js
用 Javascript 验证表单(form)中多选框(checkbox)值
Sep 08 #Javascript
Javascript String.replace的妙用
Sep 08 #Javascript
Javascript 检测、添加、移除样式(className)函数代码
Sep 08 #Javascript
javascript 流畅动画实现原理
Sep 08 #Javascript
javascript 定义初始化数组函数
Sep 07 #Javascript
javascript十个最常用的自定义函数(中文版)
Sep 07 #Javascript
javascript 获取select下拉列表值的代码
Sep 07 #Javascript
You might like
通过ODBC连接的SQL SERVER实例
2006/10/09 PHP
关于PHP session 存储方式的详细介绍
2013/06/25 PHP
ThinkPHP字符串函数及常用函数汇总
2014/07/18 PHP
PHP中两个float(浮点数)比较实例分析
2015/09/27 PHP
CI框架文件上传类及图像处理类用法分析
2016/05/18 PHP
Jquery Ajax请求代码(2)
2011/01/07 Javascript
这些年、我收集的JQuery代码小结
2012/08/01 Javascript
用JavaScript计算在UTF-8下存储字符串占用字节数
2013/08/08 Javascript
js设置cookie过期及清除浏览器对应名称的cookie
2013/10/24 Javascript
javascript实现添加附件功能的方法
2015/11/18 Javascript
jQuery简单设置文本框回车事件的方法
2016/08/01 Javascript
Node.js编写CLI的实例详解
2017/05/17 Javascript
jQuery实现input[type=file]多图预览上传删除等功能
2019/08/02 jQuery
浅析JavaScript预编译和暗示全局变量
2020/09/03 Javascript
[06:07]DOTA2-DPC中国联赛 正赛 Ehome vs VG 选手采访
2021/03/11 DOTA
Python中使用支持向量机(SVM)算法
2017/12/26 Python
Python中实现变量赋值传递时的引用和拷贝方法
2018/04/29 Python
pip安装时ReadTimeoutError的解决方法
2018/06/12 Python
Django实战之用户认证(初始配置)
2018/07/16 Python
在python3中pyqt5和mayavi不兼容问题的解决方法
2019/01/08 Python
使用python itchat包爬取微信好友头像形成矩形头像集的方法
2019/02/21 Python
Django数据库类库MySQLdb使用详解
2019/04/28 Python
关于Python作用域自学总结
2019/06/10 Python
python sklearn库实现简单逻辑回归的实例代码
2019/07/01 Python
python中update的基本使用方法详解
2019/07/17 Python
python实现广度优先搜索过程解析
2019/10/19 Python
Python使用正则实现计算字符串算式
2019/12/29 Python
Python MySQLdb 执行sql语句时的参数传递方式
2020/03/04 Python
html5唤醒APP小记
2019/03/27 HTML / CSS
Old Navy加拿大官网:美式休闲服饰品牌
2017/09/26 全球购物
冰淇淋店的创业计划书
2014/02/07 职场文书
2014年民政局关于保密工作整改措施
2014/09/19 职场文书
党的群众路线教育实践活动个人对照检查材料(教师)
2014/11/04 职场文书
南极大冒险观后感
2015/06/05 职场文书
python开发飞机大战游戏
2021/07/15 Python
你需要掌握的20个Python常用技巧
2022/02/28 Python