javascript - 如何让我的 Javascript 识别在我的 HTML 中选择了哪个单选按钮选项？

Question

我打算在下周仅使用 HTML、CSS 和 JavaScript 制作一款小型文本冒险游戏，但是我从一开始就遇到了问题，因为我试图让玩家获得使用单选按钮选择选项，因此他们选择一个选项，然后点击提交，基于该选项，可能会发生很多事情。但是我不知道如何实际实现这个功能......

我曾查找过与我的问题类似的教程或示例，但它们都没有太大帮助。

  <form>
    <input type="radio" name="choice" value="A1" checked> Lorem ipsum dolor sit amet, consectetur adipiscing elit. <br>
    <input type="radio" name="choice" value="A2"> Proin volutpat eros fringilla felis euismod laoreet a eu velit. <br>
    <input type="radio" name="choice" value="A3"> Mauris orci mi, luctus in leo eget, facilisis imperdiet lacus. <br><br>
    <button type="button" onclick=choiceA()> Choose </button>
  </form>

我希望能够让使用过的人检查这些选项之一，然后能够点击“选择”按钮并继续他们的方式，将他们的选择记录在 JavaScript 中以供稍后引用。

如何让我的 Javascript 识别在我的 HTML 中选择了哪个单选按钮选项？

Answer 1

您可以使用 FormData .为此，首先给表单一个标识。在这个例子中，它是用 name 属性完成的。您还可以使用 id

二次使用get获取选中表单值的方法

function choiceA(e) {
  e.preventDefault();
  var form = document.forms.namedItem("fileinfo");
  var formData = new FormData(form);
  console.log(formData.get('choice'))
  }

<form name='fileinfo'>
  <input type="radio" name="choice" value="A1" checked> Lorem ipsum dolor sit amet, consectetur adipiscing elit. <br>
  <input type="radio" name="choice" value="A2"> Proin volutpat eros fringilla felis euismod laoreet a eu velit. <br>
  <input type="radio" name="choice" value="A3"> Mauris orci mi, luctus in leo eget, facilisis imperdiet lacus. <br><br>
  <button type="submit" onclick=choiceA(event)> Choose </button>
</form>