`
liss
  • 浏览: 826112 次
  • 性别: Icon_minigender_1
  • 来自: 广州
社区版块
存档分类
最新评论

javascript中获取radio的值

JavaScriptASP.netASPHTMLQQ 
阅读更多

Radio 是 HTML 中的单选框，同一个 form 中，name 相同的 Radio 构成一组，这一组中最多只允许有一个 Radio 被选中。

如果将 form 提交到服务器端 ASP 程序，ASP 程序要获得用户选择的那个 Radio 的 value 是非常方便的，用 request.Form("RadioName")，不必理会有几个 Radio。

但在 JS(JavaScript) 中就要复杂多了，我们不能像对其它元素（如：文本框）一样，使用 formid.objName.value 来取值，我们应该循环这个组的 Radio，判断其 checked 属性，再取值。

为了方便使用javascript获取radio的值，我写了一个通用的函数来实现：

function GetRadioValue(RadioName){
    var obj;   
    obj=document.getElementsByName(RadioName);
    if(obj!=null){
        var i;
        for(i=0;i<obj.length;i++){
            if(obj[i].checked){
                return obj[i].value;           
            }
        }
    }
    return null;
}

比如，我们有一个name属性为：“myradio”的单选控件组，要得到选中的值，只需这样调用就可以了：

var RValue;

RValue=GetRadioValue("myradio");

如果没有给出的radioname控件，则直接返回null，或者这一组控件没有被选择的项，则也返回null。

 

本文来自CSDN博客，转载请标明出处：http://blog.csdn.net/liu_binq63/archive/2008/04/29/2342942.aspx

 

 

 

 

 

javascript获取单选按钮(radio)组的值和修改选中项

http://hi.baidu.com/lysoncn/blog/item/315744d94b0cf5ec39012fda.html

 

js获取单选按钮(radio)组的值和修改选中项

 

<input name="radio1" type="radio" value="1">
<input name="radio1" type="radio" value="2">
<input type="button" onClick="checks()">

JScript code
    function checks()
    {
        var radios=document.getElementsByName("radio1");
        for(var i=0;i<radios.length;i++)
        {
            if(radios[i].checked==true)
            {
                alert(radios[i].value);
            }
        }
    }

获取单选按钮(radio)组的值和修改选中项
看到很多帖子里说js获取单选按钮(radio)组的值可以直接用document.getElementById("oper").value,虽然跟单选按钮组一样的下拉列表(也是列表项的数组)也是一个数组，用这种方式可以获到下拉列表的值,但是单选按钮组却获不到所选的值。仔细研究了下，总结如下：

与下拉列表不同，单选按钮须用this.form.oper或者document.getElementsByName('oper')方式获取该数组对象，document.getElementById('oper')不能获取该数组对象(select可以)。而且要获取值须通过一循环判断获取，不能直接用.value(select可以)。而要改变单选按钮组的

选中项，也须用循环判断改变各个单选按钮的value。

测试代码radio.html 如下:

=============================================================================

<html>

<head></head>

<script language="javascript">

//求单选按纽的值，适用单选项及多选项。未选返回false；有选择项，返回选项值。

function getRadio(oRadio){

var oRadioLength= oRadio.length;

var oRadioValue = false;

//alert("oRadioLength:["+oRadioLength+"]");

if (oRadioLength== undefined){

      if (oRadio.checked){

       oRadioValue = oRadio.value;

      }

}else{

      for (i=0;i<oRadioLength;i++){

       //alert("oRadio["+i+"]:"+oRadio[i].checked+"/"+oRadio[i].value);

       if (oRadio[i].checked){

        oRadioValue = oRadio[i].value;

        break;

       }

      }

}

return oRadioValue;

}

//方法改进：

//求单选按纽的值，传radio名字作为参数。未选返回false；有选择项，返回选项值。

function getRadioValue(name){

var radioes = document.getElementsByName(name);

for(var i=0;i<radioes.length;i++)

{

     if(radioes[i].checked){

      return radioes[i].value;

     }

}

return false;

}

 

 

 

http://hi.baidu.com/wuxinxi007/blog/item/2e6573545822c9183b2935db.html

 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>javascript 获取 radio 选中值</title>
<script language="javascript" type="text/javascript">
        //Copyright 2008
        //By 小吴同学 QQ:100052800
        //Date 2008-11-25
       
        //$写法，用于获取元素ID名称
        function $(id){return document.getElementById(id);}
        //获取 radio 选中值
        function GetValue(){
            //获取 radio 所在容器名，根据容器名称搜索 radio 的标签 input
            var radios = $("radios").getElementsByTagName("input");
            //初始化对象
            var grade = "";
            //是否选中 radio,默认不选中，radio 可指定 checked="checked" 不受 flag 影响
            var flag = false;
            //根据容器中搜索到的 input 标签的个数（长度）进行遍历
            for(var i=0;i<radios.length;i++){
                //如果当前有选中
                if(radios[i].checked == true){
                    //赋值
                    grade = radios[i].value;
                    //赋值
                    flag = true;
                    //结束循环
                    break;
                }
            }
            //判断 radio 是否有选中
            if(!flag){
                alert("No choose");
                return;
            }else{
                alert(grade);
            }
        }
</script>
</head>

<body style="font:12px 'Microsoft Sans Serif'">
    <div id="radios">
        <input name="radio" type="radio" value="1"/>1
        <input name="radio" type="radio" value="2" />2
        <input name="radio" type="radio" value="3" />3
        <input name="radio" type="radio" value="4" />4
        <input name="radio" type="radio" value="5" />5
        <input name="button" type="button" value="GetValue" onclick="GetValue()"/>
    </div>
</body>
</html>
分享到：
| 不常见的input属性
评论
发表评论

您还没有登录,请您登录后再发表评论

相关推荐

    JavaScript中获取Radio被选中的值

    原理就是：一般使用遍历的方法,判断每个Radio是否被选中,如果是,再取其值. &lt;form id=userlist method=post action=option.php&gt; &lt;input type=radio name=userid value=1&gt;1 &lt;input type=radio name=...

    javascript radio值获取代码

    javascript 获取 radio 选中值 1 2 3 4 5 [Ctrl+A 全选 注:如需引入外部Js需刷新才能执行] js选中radio document.consumerform.consumer_sex[0].checked=true; 下面是网上的一些补充资料，本人感觉还不错，...

    javascript 利用ajax获取验证码内容和session值

    javascript 利用ajax获取验证码内容和session值

    JS获取选中的radio button的值

    Javascript获取被选中的Radio button的值或者文本。

    javascript 获取select下拉列表值的代码

    比如，在使用DWR的时候，如果你想传递下拉框的参数到后台的话，此时就需要先获取到下拉框的值了。 其实想要获取到下拉框的值是很简单的。 最关键的一段代码就是： 代码如下: onchange=”show(this.options[this....

    100个直接可以拿来用的JavaScript实用功能代码片段(1-10)

    10、原生JavaScript获取cookie值 11、原生JavaScript加入收藏夹 12、原生JavaScript设为首页 13、原生JavaScript判断IE6 14、原生JavaScript加载样式文件 15、原生JavaScript返回脚本内容 16、原生JavaScript清除...

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

    在用 Javascript 验证表单（form）中的单选框（radio）是否选中时，很多新手都会遇到问题，原因是 radio 和普通的文本框在获取值的时候有很大不同.

    使用JavaScript获取Request中参数的值方法

    如何通过JS访问到id和name里面的值呢，实现我们来分析一下思路。 先获取当前页面的URL，通过[removed].href。 提取该URL？后面的部分，通过slice()方法。 把获取到的Request对象分割成字符串数组，通过split() 方法...

    jQuery中获取Radio元素值的方法

    又发现自己写的JavaScript代码在FireFox下运行出错，原因很郁闷，在获取一个Radio元素的值的时候只得到了 undefind。谷歌了一下，大多跟我用的方法是一样的 代码如下:var value = $(“input[name=’radio1′][type=...

    JavaScript获取/更改文本框的值的实例代码

    是不同元素，但它们均支持同样的特性来获取包含在文本框内的文本。考虑以下例子： 代码如下:&lt;html&gt;&lt;head&gt;&lt;title&gt;Retrieying a Textbox Value Example&lt;/title&gt;[removed]function getValues()...

    jsp中radio控件的使用

    该工程主要是通过jsp和radio控件，利用JavaScript技术，简单判断radio控件是否选中，并且获取radio控件的值

    JavaScript完全自学宝典 源代码

    6.7.html 各种使用JavaScript获取复选框值的方法。 6.8.html JavaScript控制复选框。 6.9.html 复选框的JavaScript特效。 6.10.html JavaScript取单选框的值。 6.11.html JavaScript控制单选框...

    在vue项目中获取的duration属性值为NaN或者undefined.md

    在创建一个vue项目时，获取标签中duration属性值为空或者未定义的情况，针对以上可能出现的两种情况，本文给出作者本人的一些实践成功后的方法。

    程序天下:JavaScript实例自学手册

    14.13 获取JavaScript函数中的所有参数 14.14 奇偶数的判断 14.15 在JavaScript运行VBScript函数 14.16 购物篮中常用的计算总价效果 14.17 同一用户的来访统计 14.18 十六进制转换为十进制 14.19 将URL转化为16进制 ...

    javascript实现设置、获取和删除Cookie的方法

    本文实例讲述了javascript实现设置、获取和删除Cookie的方法。分享给大家供大家参考。具体实现方法如下： /* *设置Cookie * * name:cookie所对应的键 * value:cookie所对应的值 * expires:cookie所对应的有效...

    《程序天下：JavaScript实例自学手册》光盘源码

    14.13 获取JavaScript函数中的所有参数 14.14 奇偶数的判断 14.15 在JavaScript运行VBScript函数 14.16 购物篮中常用的计算总价效果 14.17 同一用户的来访统计 14.18 十六进制转换为十进制 14.19 将URL转化为16进制 ...

    sizeof:获取JavaScript对象的大小

    获取一个JavaScript对象的大小（以字节为单位） JavaScript不提供sizeof（类似于C语言），并且程序员无需关心内存分配/重新分配。 但是，根据，每个String值均由16位无符号整数表示，Number使用双精度64位格式IEEE...

    javaScript常用事件

    //y的值为从对象a中获取年份值 两位数年份 y1=a.getFullYear(); //获取全年份数 四位数年份 m=a.getMonth(); //获取月份值(0-11) d=a.getDate(); //获取日期值 d1=a.getDay(); //获取当前星期值 h=a.getHours(); //...

Magicbox
Global site tag (gtag.js) - Google Analytics