Radio value 属性
value 属性可设置或返回单选按钮的 value 属性的值。
对于单选按钮,value属性值的内容不会出现在 用户界面。value 属性值只在提交表单时向服务端传递数据。如果一个 单选按钮处于选中状态,在提交表单时,单选按钮的值才会传递到服务端(未选中按钮是不会传递数据到服务端的)。
语法
设置 value 属性:
radioObject.value="value"
返回 value 属性:
radioObject.value
浏览器支持
所有主要浏览器都支持 value 属性。
在线实例
实例
显示选按钮中选中的值:
<form> 你更喜欢哪种颜色?<br> <input type="radio" name="colors" id="red" value="red">红色<br> <input type="radio" name="colors" id="blue" value="blue">蓝色<br> <input type="radio" name="colors" id="green" value="green">绿色 </form> <button type="button" onclick="displayResult()">显示选中的值</button>
实例
显示选定的单选按钮值:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>牛客教程(nowcoder.com)</title>
<script>
function displayResult(browser){
document.getElementById("result").value=browser
}
</script>
</head>
<body>
<p>选择你最喜欢的浏览器:</p>
<form>
<input type="radio" name="browser" onclick="displayResult(this.value)" value="Internet Explorer">Internet Explorer<br>
<input type="radio" name="browser" onclick="displayResult(this.value)" value="Firefox">Firefox<br>
<input type="radio" name="browser" onclick="displayResult(this.value)" value="Opera">Opera<br>
<input type="radio" name="browser" onclick="displayResult(this.value)" value="Google Chrome">Google Chrome<br>
<input type="radio" name="browser" onclick="displayResult(this.value)" value="Safari">Safari<br><br>
你最喜欢的浏览器是: <input type="text" id="result">
</form>
</body>
</html>