Question

我在页面上有一些单选按钮，我需要根据ID确定在我的JS中检查了哪一个。我不确定为什么这不起作用。每一次，我都得到了＃34;没有检查过＆＃34;我的控制台中的消息。谢谢！

HTML：

<input type="radio" id="aud1">elephant</input>
<input type="radio" id="aud2">prairie dog</input>
<input type="radio" id="aud3">tiger</input>

JS：

var aud;
if (document.getElementById('aud1').checked) {
  var aud = document.getElementById('file1');
}else if(document.getElementById('aud2').checked) {
 var aud = document.getElementById('file2');
}else if (document.getElementById('aud3').checked){
 var aud = document.getElementById('file3');
}
else console.log('nothing checked');

Answer 1

见下文。我已经为您的代码添加了一个按钮，您可以在检查完成后单击该按钮。

最初，当页面加载时，没有点击任何内容。您的JS在页面构建后立即运行，这就是您看到没有点击任何内容的原因。

＆＃13;

document.getElementById('check-radios').onclick = function() {
  var aud;
  if (document.getElementById('aud1').checked) {
    var aud = document.getElementById('file1');
    console.log('aud1 checked');
  } 
  else if (document.getElementById('aud2').checked) {
    var aud = document.getElementById('file2');
    console.log('aud2 checked');
  } 
  else if (document.getElementById('aud3').checked) {
    var aud = document.getElementById('file3');
    console.log('aud3 checked');
  } 
  else console.log('nothing checked');
}

＆＃13;

<input type="radio" id="aud1">elephant</input>
<input type="radio" id="aud2">prairie dog</input>
<input type="radio" id="aud3">tiger</input>

<button id="check-radios">Check for clicked</button>

＆＃13;

Answer 2

你真的需要这个代码吗？为什么不使用单个类，并将文件名/ desc作为自定义属性，如下所示：

    <input type="radio" name="animals" class="order" data-animal="elephant" />elephant
    <input type="radio" name="animals" class="order" data-animal="zebra" />zebra
    <input type="radio" name="animals" class="order" data-animal="lion" />lion


<script>
    $(".order").click(function () {
    var choice = this.getAttribute("data-animal");

    alert(choice);
    /* console.log(choice); */
})
</script>

这样你就不必手动添加更多代码了，你可以使用相同的类和不同的属性值在顶部添加html ...更容易维护 -

此外，由于你有一个elseif我添加了一个名称，将它们分组为单独的无线电，因为我认为你的意图？

 <input type="radio" name="animals" class="order" checked data-animal="zebra">zebra

请记住输入标签没有结束标记 - 只是/＆gt;最后而不是＆gt;

.checked不识别是否选中了单选按钮

2 个答案: