数据结构
网络
RDBMS
操作系统
Java
MS Excel
iOS
HTML
CSS
Android
Python
C 编程
C++
C#
MongoDB
MySQL
Javascript
PHP
物理
化学
生物
数学
英语
经济学
心理学
社会学
时尚研究
法律研究HTML DOM Input Radio value 属性
HTML DOM Input radio value 属性与 type=”radio” 且具有 value 属性的 input 元素相关联。它用于返回单选按钮 value 属性的值或设置该值。
单选按钮的 value 属性不会影响网站的用户界面，因为内容根本不会显示。但是，在提交表单时，它可以用来区分同一组中的多个按钮。
语法
以下是语法：-
设置 value 属性：-
radioObject.value = text;
这里，text 用于为单选按钮指定值。
示例
让我们来看一个 input radio value 属性的示例：-
<!DOCTYPE html>
<html>
<body>
<h1>Input radio Value property</h1>
<form>
FRUIT:
<input type="radio" name="fruits" id="BTN1" value="Mango" >Mango
<br>
</form>
<p>Get the above element value by clicking the below button</p>
<button type=”button” onclick="getValue()">Get Value</button>
<p id="Sample"></p>
<script>
function getValue() {
var t = document.getElementById("BTN1").value;
document.getElementById("Sample").innerHTML = "The value for the radio button is : "+t;
}
</script>
</body>
</html>输出
这将产生以下输出：-
点击“获取值”按钮：-
在上面的示例中：-
我们首先在表单内创建了一个 input 元素，其 type=”radio”，name=”fruits”，id=”BTN1” 和 value “Mango”：-
<form> FRUIT: <input type="radio" name="fruits" id=”BTN1" value=”mango>Mango </form>
然后我们创建了一个“GET 类型”按钮，当用户点击该按钮时，它将执行 radioType() 方法：-
<button type=”button” onclick="radioType()">GET Type</button>
getValue() 方法使用 getElementById() 方法获取 input 元素，并将它的“value”属性值赋给变量 t。如果未为单选按钮指定 value 属性，它将返回一个空字符串。然后，使用它的 innerHTML 属性，将此变量显示在 id 为“Sample”的段落中：-
function getValue() {
var t = document.getElementById("PASS1").value;
document.getElementById("Sample").innerHTML = "The value for the input field is : "+t;
}
更新于： 2019年8月22日
125 次查看
广告