Description

This pair of Javascript function can get or set the checked value of a group of radio buttons.  These functions are specially designed for dynamic pages, and work without error with zero, one, or more radio buttons.  Also, because the radio length is saved before looping, this function is much faster.  Finally, the functions are granted to the public domain.

Source Code

// return the value of the radio button that is checked
// return an empty string if none are checked, or
// there are no radio buttons
function getCheckedValue(radioObj) {
if(!radioObj)
return "";
var radioLength = radioObj.length;
if(radioLength == undefined)
if(radioObj.checked)
return radioObj.value;
else
return "";
for(var i = 0; i < radioLength; i++) {
if(radioObj[i].checked) {
return radioObj[i].value;
}
}
return "";
} // set the radio button with the given value as being checked
// do nothing if there are no radio buttons
// if the given value does not exist, all the radio buttons
// are reset to unchecked
function setCheckedValue(radioObj, newValue) {
if(!radioObj)
return;
var radioLength = radioObj.length;
if(radioLength == undefined) {
radioObj.checked = (radioObj.value == newValue.toString());
return;
}
for(var i = 0; i < radioLength; i++) {
radioObj[i].checked = false;
if(radioObj[i].value == newValue.toString()) {
radioObj[i].checked = true;
}
}
}

Example

Use the view source command in your browser to see how the code below works.  Note the use of the label HTML tag with a style that gives it a border and background color. You should always use the label tag with radio buttons. This signals to the user that the whole boxed area may be clicked to set the radio button, rather than just the tiny circle.

If you are using a scripting language like PHP, ColdFusion, or ASP, then write a function that prints your radio buttons from an array.  It can automatically write the for and id properties by concatenating the radio name and value.

Zero One Two Three Four

Javascript Get or Set Checked Radio Value的更多相关文章

  1. 【JavaScript&jQuery】单选框radio,复选框checkbox,下拉选择框select

    HTML: <!DOCTYPE html> <html> <head> <title></title> <meta charset=& ...

  2. Jquery radio checked

    Jquery radio checked     radio 1. $("input[name='radio_name'][checked]").val(); //选择被选中Rad ...

  3. JavaScript jQuery 入门回顾

    ​$符号 $是著名的jQuery符号.实际上,jQuery把所有功能全部封装在一个全局变量jQuery中,而$也是一个合法的变量名,它是变量jQuery的别名: window.jQuery; // j ...

  4. 自定义radio图标

    问题: 默认的radio控件不是很好看,我们能否自定义一个radio图标? 解决: 1.radio有input和lable两个标签. 2.<input>是前面的图标,选中后图标变化. 3. ...

  5. radio(单选框)反复选中与取消选中

    做个记录,以便需要拿取 <script type="text/javascript"> $(function(){ 第一种 $('input:radio').click ...

  6. How to get the value of a form element : check box and radio button

    Getting a radio element and it’s checked value Radio buttons in a form can be grouped together using ...

  7. JQuery控制radio选中和不选中方法总结

    一.设置选中方法 代码如下: $("input[name='名字']").get(0).checked=true; $("input[name='名字']"). ...

  8. 表单:checkbox、radio样式(用图片换掉默认样式)

    checkbox.radio样式(用图片换掉默认样式) <!doctype html> <html> <head> <meta charset="u ...

  9. js之radio应用实例

    radio和checkbox还有select,可谓是前后端常用三剑客啊!特别是checkbox和select,关于这两个今天不讲,因为在下面这几篇文章,我已经比较详细的讲解了. SpringMVC之a ...

随机推荐

  1. python读取yaml配置文件

    支持多种语言:python.js.golang.java.c.c++ YAML 语言(发音 /ˈjæməl/ )的设计目标,就是方便人类读写.它实质上是一种通用的数据串行化格式. 它的基本语法规则如下 ...

  2. Maven 搭建spring boot多模块项目(附源码),亲测可以,感谢原创

    原创地址:https://segmentfault.com/a/1190000005020589 我的DEMO码云地址,持续添加新功能: https://gitee.com/itbase/Spring ...

  3. TFS中查看我的所有签入迁出记录 TFS 怎么查看所有的修改

    [源代码资源管理器]=>左边窗口目录树选中一行项目=>右键 查看历史记录=>在历史记录中,双击变更集即可以看到某一次变更的所有记录.

  4. 使用jstl标签时提示The absolute uri: http://java.sun.com/jsp/jstl/core cannot

    http://www.360doc.com/content/11/1219/15/1007797_173395882.shtml 检查应用目录下WEB-INF的lib里是否有jstl.jar和stan ...

  5. SQL Server 2005 分区表实践——分区切换

    本文演示了 SQL Server 2005 分区表分区切换的三种形式: 1. 切换分区表的一个分区到普通数据表中:Partition to Table: 2. 切换普通表数据到分区表的一个分区中:Ta ...

  6. spring boot整合mybatis+mybatis-plus

    Spring boot对于我来说是一个刚接触的新东西,学习过程中,发现这东西还是很容易上手的,Spring boot没配置时会默认使用Spring data jpa,这东西可以说一个极简洁的工具,可是 ...

  7. [Python爬虫] :Selenium +phantomjs 利用 pyquery抓取脚本链接对应的内容

    抓取上面对应链接的网页的文章的内容 ele = element.attr("onclick") self.driver.execute_script(ele) sub_seleni ...

  8. CHtmlEditCtrl (3): More HTML Editor Options

    In this version of our HTML Editor, we'll create a floating source view/edit window and we'll implem ...

  9. SharePoint中Rating相关的字段。

      From: https://sharepoint.stackexchange.com/questions/194197/how-to-manipulate-likeby-nooflikes-rat ...

  10. XE6入门(一)Hello World

    XE6的IDE已经设计的非常棒了,是该放弃D7了,投入XE6的怀抱.. 本人用的XE6版本是 Embarcadero.Delphi.XE6.RTM.Inc.Update1.v20.0.16277.12 ...