`

javascript radio值获取代码

radio 
阅读更多
1，用js获取radio的值。 
<!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=gb2312" /> 
<title>javascript 获取 radio 选中值-www.jbxue.com</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>


2，js选中radio
document.consumerform.consumer_sex[0].checked=true;
通过一个函数方便地取 Radio 选中值的情况，该程序适用于两个及以上的同名 Radio。但实际中，仅有一个 Radio 的情况也存在，于是我们得增强程序功能，使程序适用于一个及以上的同名 Radio。 
<html> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=gb2312"> 
<title>读取 Radio 的值-www.jbxue.com</title> 
</head> 
<body> 
<form id="form1" action="" method=""> 
<div><input type="radio" name="r" id="r1" value="一"><label for="r1">选项一</label></div> 
<div><input type="button" value="检查选择项" onclick="javascript:Foo();"></div> 
</form> 
<script type="text/javascript" language="javascript"> 
<!-- 
function Foo() 
{ 
var selectedIndex = -1; 
var form1 = document.getElementById("form1"); 
var i = 0; 
if (form1.r.value != undefined) 
{ 
//只有一个 radio 的情况 
if (form1.r.checked) 
{ 
selectedIndex = 0; 
alert("您选择项的 value 是：" + form1.r.value); 
} 
else 
{ 
alert("您没有选择任何项"); 
} 
return; 
} 
for (i=0; i<form1.r.length; i++) 
{ 
if (form1.r[i].checked) 
{ 
selectedIndex = i; 
alert("您选择项的 value 是：" + form1.r[i].value); 
break; 
} 
} 
if (selectedIndex < 0) 
{ 
alert("您没有选择任何项"); 
} 
} 
--> 
</script> 
</body> 
</html>
分享到：
| jQuery中获取Radio元素值的方法
评论
发表评论

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

相关推荐

    js中获取jsp表单中radio类型的值简单实例

    本文将通过一个简单实例，讲解如何在JavaScript中获取JSP表单中单选按钮（radio）类型的值。 首先，我们需要了解单选按钮（radio）在HTML表单中的基本用法。单选按钮允许用户在一组选项中选择一个值，它通常使用`...

    html中radio值的获取、赋值、注册事件示例详解

    要获取一组radio按钮中选中项的值，可以通过JavaScript或jQuery来实现。使用jQuery时，可以先通过name属性选中这组radio，然后使用jQuery提供的过滤方法“:checked”找到当前选中的radio按钮，之后再获取其值或属性...

    javascript获得单选框的值

    在本文中，我们将深入探讨如何使用JavaScript获取HTML页面中的单选框的值，并对其进行封装以提高代码的可重用性和可维护性。 #### 单选框概述 单选框通过`&lt;input type="radio"&gt;`标签创建。每个单选框必须具有相同...

    JQuery判断radio是否有选中，获取选中的值

    本文将深入探讨如何使用jQuery来判断单选按钮（radio）是否有被选中，并获取选中的值。 首先，我们需要理解HTML中的`&lt;input type="radio"&gt;`元素。在网页中，单选按钮通常用于提供一组互斥的选择选项，用户只能选择...

    jquery获取各种radio,checkbox,select的值等

    在JavaScript的世界里，jQuery库提供了一种简洁的方式来操作DOM元素，包括处理radio、checkbox和select。这些元素在网页表单中十分常见，用于收集用户输入。以下是对标题和描述中涉及的知识点的详细说明： 1. **...

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

    在JavaScript中，我们可以通过DOM（文档对象模型）操作来获取和设置单选按钮的值。在进行验证之前，我们需要先获取到单选按钮的DOM元素。通常情况下，可以使用document.getElementById()、document....

    JavaScript中获取Radio被选中的值

    在学习Web前端开发的过程中，掌握如何用JavaScript获取表单中单选按钮（Radio）被选中的值是一个常见的需求。单选按钮通常用于在一组选项中让用户只能选择一个。在HTML中，单选按钮的name属性值必须相同，以确保它们...

    如何使用Jquery获取Form表单中被选中的radio值

    本文将详细介绍如何使用jQuery获取表单中被选中的radio按钮的值。 首先，我们来看一个简单的HTML表单示例： ```html &lt;!-- 省略200字 --&gt; &lt;input type='radio' name='opType' value='0' /&gt;搁置 ...

    分别用vbscript和javascript实现显示radio的选项值.doc

    为了使VBScript的代码能够与JavaScript类似地工作，可以对VBScript的`show`子程序进行修改，如上所示，通过`window.event.srcElement.name`获取事件源的名称，然后使用`document.getElementsByName()`来获取所有具有...

    【JavaScript源代码】react实现Radio组件的示例代码.docx

    在React中，创建自定义组件是常见的需求，本示例中展示了如何用JavaScript实现一个Radio（单选框）组件。这个示例分为三个主要部分：`Test`组件、`RadioGroup`组件和`Radio`组件。 1. `Test`组件： 这是整个示例的...

    Jquery 获取input 值

    这段代码通过选择器 `input[name=items]:checked` 选择了所有 name 属性为 `items` 且被选中的 radio 按钮，并通过 `.val()` 方法获取其 value 属性的值。 ### 二、设置 Radio 按钮的值 有时候我们需要手动设置...

    网页编程JAVASCRIPT实例代码

    4. **js-radio.htm**：JavaScript可以处理HTML中的复选框（radio buttons），这个文件可能包含了如何检查、选择或取消选择单选按钮，以及处理相关事件的代码。 5. **js-onmousedown.htm**：这个文件可能关注于`...

    js获取 type=radio 值的方法

    在JavaScript中，获取`type=radio`的值通常涉及到处理HTML中的单选按钮（Radio Buttons）。这些按钮在网页表单中用于提供多个选择项，用户只能选择其中之一。`type=radio`是HTML5中定义的一个属性，用于创建单选按钮...

    jquery获取radio值(单选组radio)

    本文将详细解释如何使用jQuery来获取单选按钮组（radio group）的值。 ### jQuery获取单选按钮值的原理 要获取单选按钮组的值，我们首先需要理解jQuery选择器的使用。在jQuery中，我们可以使用属性选择器来选取...

    如何使用jQUery获取选中radio对应的值(一句代码)

    标题提到的"如何使用jQuery获取选中radio对应的值(一句代码)"，实际上就是通过jQuery选择器找到当前被选中的`radio`按钮，并获取其`value`属性。以下是对这个过程的详细解释： 首先，我们需要理解jQuery的选择器。...

    jsp中radio控件的使用

    本项目展示了如何在JSP页面中使用`radio`控件，结合JavaScript进行用户交互处理，如判断是否选中以及获取选中的`radio`控件的值。 首先，我们来理解`radio`控件的基本结构。在HTML中，`&lt;input&gt;`标签用于创建`radio`...

    js简单获取表单中单选按钮值的方法

    本文将介绍如何使用JavaScript简单地获取表单中单选按钮的值，并涉及到表单元素的遍历与查找技巧。 首先，单选按钮在HTML中的定义通常是使用`&lt;input&gt;`标签，并将`type`属性设置为`radio`。单选按钮通常会具有相同的...

    javascript获值

    在JavaScript中，获取表单元素的值是一项基本操作，尤其对于处理用户输入的数据至关重要。本文主要探讨了如何获取三种常见的表单元素——复选框（checkbox）、单选按钮（radio）以及下拉列表（select）的值。 1. **...

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