Question

我的HTML表单中有一个单选按钮组：

<form action="handler.php">
  <p><b>a or b or c</b></p>
  <p><input type="radio" id="abc" name="answer" value="a1">1<Br>
  <input type="radio" id="abc" name="answer" value="a2">2<Br>
  <input type="radio" id="abc" name="answer" value="a3">3</p>
 </form>

我想检查是否选中了特定的单选按钮（例如，值为a1），然后显示图片是否为：

<script>
function ShowPicture() {
  var word = document.getElementById("abc").value;

  if (word == "a1") {
      document.getElementById("demo").innerHTML = '<iframe src="http://picturesite.com/index" width="1024" height="720" align="left">';
  } 
}
</script>

如何确定单选按钮是否已选中，以便我可以在用于显示图像的条件下使用它？

Answer 1

这有助于您：

＆＃13;

<html>
    <head>
    </head>
    <body>
        <form action="handler.php">
              <p><b>a or b or c</b></p>
            <p><input type="radio" class="abc" name="answer" value="a1" onchange="ShowPicture()">1</p>
            <p><input type="radio" class="abc" name="answer" value="a2" onchange="ShowPicture()">2</p>
            <p><input type="radio" class="abc" name="answer" value="a3" onchange="ShowPicture()">3</p>
        </form>
        <div id="demo"></div>
        <script>
           function ShowPicture() {
              var word = document.getElementsByClassName("abc");
              var len = word.length;
               for(var i=0;i< len-1; i++) {
                   if(word[i].value == "a1" && word[i].checked)
                   document.getElementById("demo").innerHTML = '<iframe src="http://picturesite.com/index" width="1024" height="720" align="left">'
                   
               }
            }
        </script>
    </body>
</html>

＆＃13;

Answer 2

id必须是唯一的，因此您的代码无效！但是我有两种方法可以解决你的问题。第一种是通过名称获取，第二种是通过标记名获取。这两个函数返回一个节点列表，因此需要循环...

//var word = document.getElementsByName("answer"); //get by name
 var word = document.getElementsByTagName("input");//get element name
 for(var i =0;i<word.length;i++){
  if(word[i].value == "a1") {
  document.getElementById("demo").innerHTML = '<iframe src="http://picturesite.com/index" width="1024" height="720" align="left">';
  } 
}

如何确定单选按钮组中的特定单选按钮是否已选中？

2 个答案: