转自:http://blog.sina.com.cn/s/blog_50a1e17401017pik.html

提前知识准备:

在一个HTML文档中,每个元素都可以设置ID和NAME属性。

其中ID属性是唯一属性,不可以重复,一个ID值只能对应一个元素;

而NAME属性是可以重复的,一个NAME值可以对应一组元素。
所以,使用document.getElementByIdx_x(ID)时返回的只有一个被选中的HTML元素;
而使用document.getElementsByName(NAME)时返回的是一个由多个HTML元素组成的数组

(哪怕HTML页面中只有一个符合要求的元素,返回的也是数组)。

document.getElementsByName(NAME)多用于在FORM表单中选取一组checkbox或radio

方法1:

<html>
 <head>
  <script type =
"text/javascript">
  function change()
  {
   var radio =
document.getElementsByName("form1");
   //var radio =
document.getElementByIdx_x("form1");

// 用ById就不能取得全部的radio值,而是每次返回都为1
   var
radioLength = radio.length;
   for(var i =
0;i < radioLength;i++)
   {
    if(radio[i].checked)

{

var
radioValue = radio[i].value;
     alert(radioValue);

}

}
  }

</script>

</head>
 
 <body>
  <input type =
"radio" id = "form1" name = "form1" value = "1" onchange =
"change();">选择1
  <input type =
"radio" id = "form1" name = "form1" value = "2" onchange =
"change();">选择2
  
 </body>
</html>

方法2:

<html>
 <head>
  <script type =
"text/javascript">
  function change()
  {
   var
New=document.getElementsByName("form1");
   var
strNew;
   for(var
i=0;i<New.length;i++)
   {
    if(New.item(i).checked)

{

strNew=New.item(i).getAttribute("value");

alert(
strNew );  // item()方法:返回集合中的当前项
     break;

}

else

{

continue;

}

}

}
  </script>

</head>
 
 <body>
  <input type =
"radio" id = "form1" name = "form1" value = "1" onchange =
"change();">选择1
  <input type =
"radio" id = "form1" name = "form1" value = "2" onchange =
"change();">选择2
 </body>
</html>

 

通过JS的事件处理取得radio的值的更多相关文章

  1. js获取单选框radio的值

    遇到一个js获取radio值的问题,原来根据frm.type.value取到的值在ie下是空值 解决办法:type为每个radio的值 var chkObjs=document.getElements ...

  2. easyui 》 radio取值,checkbox取值,select取值,radio选中,checkbox选中,select选中

    获取一组radio被选中项的值var item = $('input[@name=items][@checked]').val();获取select被选中项的文本var item = $(" ...

  3. zepto.js的事件处理

    能够深入理解zepto对事件的处理,那么整个JS的事件处理就应该差不多合格了,事件处理是JS语言的一个难点. 1. 首先来看$.event函数. JS中有很多事件,都是已经定义好了,我们直接调用就可以 ...

  4. jquery radio取值,checkbox取值,select取值,radio选中,checkbox选中,select选中

    jQuery获取Select选择的Text和Value: 语法解释: 1. $("#select_id").change(function(){//code...}); //为Se ...

  5. jsp之radio取值与赋值

    转自:https://blog.csdn.net/dongfengkuayue/article/details/50352937 取radio的值: js代码 $("input[name=' ...

  6. js 实时监听input中值变化

    注意:用到了jquery需要引入jquery.min.js. 需求: 1.每个地方需要分别打分,总分为100; 2.第一个打分总分为40; 3.第二个打分总分为60. 注意:需要判断null.&quo ...

  7. jQuery radio取值,checkbox取值,select取值

    语法解释: $("#select_id").change(function(){//code...}); //为Select添加事件,当选择其中一项时触发 var checkTex ...

  8. jQuery获取循环中的选中单选按钮radio的值

    1.<input type="radio" name="testradio" value="jquery获取radio的值" /> ...

  9. Js获取后台集合List的值和下标的方法

    Js获取后台集合List的值和下标的方法 转载自:http://blog.csdn.net/XiaoKanZheShiJie/article/details/47280449 首先用的是struts2 ...

随机推荐

  1. thinkphp的model的where条件的两种形式

    thinkphp的model的where查询时有两种形式. $model->field('id')->where('customer_num is null or customer_num ...

  2. codevs2557张程易(背包dp)

    2557 张程易,编程易  时间限制: 2 s  空间限制: 128000 KB  题目等级 : 钻石 Diamond 题目描述 Description 张程易是一名神奇的魔法少女,在oier之中有着 ...

  3. SpringBoot集成Redis来实现缓存技术方案

    概述 在我们的日常项目开发过程中缓存是无处不在的,因为它可以极大的提高系统的访问速度,关于缓存的框架也种类繁多,今天主要介绍的是使用现在非常流行的NoSQL数据库(Redis)来实现我们的缓存需求. ...

  4. ubuntu 更显列表 [Connecting to archive.ubuntu.com (2001:67c:1360:8001::21)] 超时的解决方法

    问题描述: 在使用apt-get update 时更行列表,显示[Connecting to archive.ubuntu.com (2001:67c:1360:8001::21)]超时 分析: 我已 ...

  5. 月薪5K和月薪50K的程序员,差距都在哪里?

    毕业两年买房买车,BAT里拼杀年薪百万.这些大神级的传说想必大家都有耳闻. 而渴望成为人生赢家的程序员们也怀揣着这样梦想,纷纷踏入互联网的大门.   假以时日,这些人的差距愈发明显.最直观的就是薪资水 ...

  6. 在3D中两条射线的相交性检测

    摘自[3D数学基础: 图形与游戏开发] 考虑在3D中两条以参数形式定义的射线: \(\vec{r_1}(t_1)=\vec{p_1}+t_1\vec{d_1}\) \(\vec{r_2}(t_2)=\ ...

  7. Android 6.0 如何添加完整的系统服务(app-framework-kernel)

    最近学习了如何在Android 6.0上添加一个系统服务,APP如何通过新增的系统服务访问底层驱动.在这学习过程中,收获颇多,并结合学习了<Embeded Android>--Karim ...

  8. Android基于HttpUrlConnection类的文件下载

    /** * get方法的文件下载 * <p> * 特别说明 android中的progressBar是google唯一的做了处理的可以在子线程中更新UI的控件 * * @param pat ...

  9. html5——多媒体(一)

    <audio> 1.autoplay 自动播放 2.controls 是否显不默认播放控件 3.loop 循环播放 4.preload 预加载 同时设置autoplay时些属性失效 5.由 ...

  10. CSS——个人资料demo

    1.上下外边距合并,选最大值. 2.两个input标签在编辑中如果换行了,在浏览器中显示的时候会自动增加一些距离. <!DOCTYPE html> <html lang=" ...