如何访问单选按钮的值

内容来源于 Stack Overflow,并遵循CC BY-SA 3.0许可协议进行翻译与使用

  • 回答 (2)
  • 关注 (0)
  • 查看 (54)

我试图访问一个单选按钮的值,使用HTML和Javascript来做一个简单的测试,但它似乎不起作用。这是我的代码:

function check() {
var a = document.getElementById("test").value
if (a === "one") {
alert("Correct!")
} else {
alert("Wrong!")
}
}
<h1><center>Simple Quiz</center></h1>
<br>
1) What is 1 + 1?
<br>
<form>
  <input type="radio" name="one" id="test" value="one">1<br>
  <input type="radio" name="one" id="test" value="two">2<br>
  <input type="radio" name="one" id="test" value="three">3<br>
  <button onclick="check()">Check</button>
</form>
提问于
用户回答回答于

首先,你不能拥有同样的ID多元素。让你的元素独一无二ID如果你需要给他们同样的风格class相反。

而不是检查value对于单选按钮,应该检查单选按钮是否是checked

看看下面的例子。

function check() {
  if (document.getElementById('test2').checked) {
    alert('correct');
  } else {
    alert('wrong');
  }
}
<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width">
  <title>Example</title>
</head>
<body>
  <h1><center>Simple Quiz</center></h1>
<br>
1) What is 1 + 1?
<br>
<form>
  <input type="radio" name="one" id="test1" value="one">1<br>
  <input type="radio" name="one" id="test2" value="two">2<br>
  <input type="radio" name="one" id="test3" value="three">3<br>
  <button onclick="check()">Check</button>
</form>
</body>
</html>

热门问答

腾讯会议,电脑版,召开会议提示发生异常(错误码:-161)),是什么问题?

推荐已采纳
-161是媒体服务器连接超时,造成该问题的原因可能有: 1. 网络异常 2. 开启了V** 3. 网络有防火墙或上网策略控制 4. 安装风行加速器进行LSP劫持 可以按照上述信息排查一下。... 展开详请

对象存储通过直传首次上传成功后怎么使直传链接失效,防止重新上传?

可酷可乐

腾讯云 · 售后工程师 (已认证)

热爱云计算的小锅一枚。
推荐
从当前的签名机制上看,并不能做到使用后即失效。有两种方式可以降低风险。 1.在web直传模式中,需要向STS申请临时账号,临时账号生效的时间是由durationInSeconds参数控制,可以尽量缩短时间配置。 2.在申请STS时,需要设置policy,确保当前客户端只能上传到C...... 展开详请

移动直播iOS端SDK使用动效触发filepath must not be nil相关crash?

腾讯视频云-ZacharyTXLiteAVSDK技术支持
推荐
移动直播TXLiteAVSDK_Enterprise_iOS在6.8及之后的版本,动效资源有改动,如果新版本还是用之前老的版本的动效资源就会导致该crash问题。参考集成文档重新导入一下动效资源即可:https://cloud.tencent.com/document/produ...... 展开详请

通过自行开发web前端从物联网平台获取数据?

DylanRichard

腾讯 · 产品经理 (已认证)

万物互联的时代,欢迎来到IoT的世界
推荐
你们可以自行开发小程序或者服务端接受数据,物联网平台了相关的API接口: 1.服务端API接口:https://cloud.tencent.com/document/product/1081/34957 2.应用端API接口:https://cloud.tencent.com/d...... 展开详请

关于文字鉴别的违法的问题?

ritchiechen

腾讯 · 后台开发工程师 (已认证)

推荐

请使用 `try catch` 捕获异常,查看堆栈信息

怎么实现存储桶设置私有读写的时候,可以直接访问图片,和复制临时链接一直的功能?

幻象丛林RESTful 服务开发者
推荐
临时链接是携带了签名参数,在后台复制时是自动算好的,可以在签名有效期内临时访问对象。 如果需要自己实现的话可以调用GET Object接口,携带Authorization签名。 GET /<ObjectKey> HTTP/1.1 Host: <BucketName-APPID>....... 展开详请

所属标签

扫码关注云+社区

领取腾讯云代金券

玩转腾讯云 有奖征文活动