通过JS的事件处理取得radio的值
转自: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的值的更多相关文章
- js获取单选框radio的值
遇到一个js获取radio值的问题,原来根据frm.type.value取到的值在ie下是空值 解决办法:type为每个radio的值 var chkObjs=document.getElements ...
- easyui 》 radio取值,checkbox取值,select取值,radio选中,checkbox选中,select选中
获取一组radio被选中项的值var item = $('input[@name=items][@checked]').val();获取select被选中项的文本var item = $(" ...
- zepto.js的事件处理
能够深入理解zepto对事件的处理,那么整个JS的事件处理就应该差不多合格了,事件处理是JS语言的一个难点. 1. 首先来看$.event函数. JS中有很多事件,都是已经定义好了,我们直接调用就可以 ...
- jquery radio取值,checkbox取值,select取值,radio选中,checkbox选中,select选中
jQuery获取Select选择的Text和Value: 语法解释: 1. $("#select_id").change(function(){//code...}); //为Se ...
- jsp之radio取值与赋值
转自:https://blog.csdn.net/dongfengkuayue/article/details/50352937 取radio的值: js代码 $("input[name=' ...
- js 实时监听input中值变化
注意:用到了jquery需要引入jquery.min.js. 需求: 1.每个地方需要分别打分,总分为100; 2.第一个打分总分为40; 3.第二个打分总分为60. 注意:需要判断null.&quo ...
- jQuery radio取值,checkbox取值,select取值
语法解释: $("#select_id").change(function(){//code...}); //为Select添加事件,当选择其中一项时触发 var checkTex ...
- jQuery获取循环中的选中单选按钮radio的值
1.<input type="radio" name="testradio" value="jquery获取radio的值" /> ...
- Js获取后台集合List的值和下标的方法
Js获取后台集合List的值和下标的方法 转载自:http://blog.csdn.net/XiaoKanZheShiJie/article/details/47280449 首先用的是struts2 ...
随机推荐
- 【废弃】【WIP】JavaScript 函数
创建: 2017/10/09 更新: 2017/11/03 加上[wip] 废弃: 2019/02/19 重构此篇.原文归入废弃 增加[废弃中]标签与总体任务 结束: 2019/03/12 完成废弃 ...
- yii2的form表单用法
使用表单 本章节将介绍如何创建一个从用户那搜集数据的表单页.该页将显示一个包含 name 输入框和 email 输入框的表单.当搜集完这两部分信息后,页面将会显示用户输入的信息. 为了实现这个目标,除 ...
- null, undefined,"",0,false是什么关系?
null本质上和0,"",false是一类东西,它们都表示一种数据类型的非值.正如0表示数字类型的非值,""表示字符类型的非值一样,null表示完全空的对象,即 ...
- aixcoder智能编程助手开发插件推荐
1. aixcoder安装使用 1.1. 介绍 1.1.1. 功能 智能代码提示她用强大的深度学习引擎,能给出更加精确的代码提示: 代码风格检查她有代码风格智能检查能力,帮助开发者改善代码质量: 编程 ...
- JavaScript Date 日期操作
在前端工程师的道路上,可能有时候需要与时间来打交道,下面我们来看一下日常对日期的操作,今天我们介绍的是Day.js插件 Day.js 是一个轻量的处理时间和日期的 JavaScript 库,和 Mom ...
- ckeditor 工具栏的配置
config.toolbar = [ ['Undo','Redo'], ['Font','FontSize'], ['Bold','Ita ...
- 345 Reverse Vowels of a String 反转字符串中的元音字母
编写一个函数,以字符串作为输入,反转该字符串中的元音字母.示例 1:给定 s = "hello", 返回 "holle".示例 2:给定 s = "l ...
- JVM中线程状态转换图
JVM中线程的状态转换图 线程在一定条件下,状态会发生变化.线程一共有以下几种状态: 1.新建状态(New):新创建了一个线程对象. 2.就绪状态(Runnable):线程对象创建后,其他线程调用了该 ...
- HTML TabIndex属性
TabIndex作用: tabindex:全局属性.指示其元素是否可以聚焦(获得焦点),以及它是否/在何处参与顺序键盘导航(因通常使用tab键操作,顾因此得名). 当使用tab键在网页控件中进行导航时 ...
- html5——web字体
基本介绍 1.自定义网页特殊字体,无需考虑用户电脑上是否安装了此特殊字体,从此把特殊字体处理成图片的时代便成为了过去. 2.支持程度比较好,甚至IE低版本浏览器也能支持. 3.web字体的大小鉴定是字 ...