HTML：根据选择显示下拉列表或文本字段的单选按钮

Question

您好，我想创建一个简单的功能，当用户单击单选按钮值 'Yes' 时，它将显示一个下拉列表，但当用户单击否时，它将显示一个文本字段。然后，这些值将被插入到数据库中。

这是我的单选按钮、下拉列表代码和文本字段代码：

<td>Principle Author / Member</td>
<td>:</td>
<td>SEC member?
  <br/>
  <input type="radio" onclick="javascript:check();" name="radiocheck" id="yes">Yes
  <input type="radio" onclick="javascript:check();" name="radiocheck" id="no">No
  <br />
  <div id="checkyes" name="checkyes" style="display:none;">
    <select name="p_author" id="p_author">
      <option value="A">A</option>
      <option value="B">B</option>
      <option value="C">C</option>
      <option value="D">D</option>
      <option value="E">E</option>
      <option value="F">F</option>
      <option value="G">G</option>
      <option value="H">H</option>
      <option value="I">I</option>
      <option value="J">J</option>
      <option value="K">K</option>
      <option value="K">K</option>
      <option value="L">L</option>
      <option value="M">M</option>
      <option value="N">N</option>
      <option value="O">O</option>
      <option value="P">P</option>
      <option value="Q">Q</option>
      <option value="R">R</option>
      <option value="S">S</option>
      <option value="T">T</option>
    </select>
  </div>
  <div id="checkno" name="checkno" style="display:none">
    <input type="text" name="p_author" id="p_author" size="40" placeholder="Please enter here..">
  </div>
</td>

这是我的 Javascript 代码：

function check() {
  if (document.getElementById('yes').checked) {
    document.getElementById('checkyes').style.display = 'block';
    document.getElementById('checkno').style.display = 'none';
  } else {
    document.getElementById('checkyes').style.display = 'none';
    document.getElementById('checkno').style.display = 'block';
  }
}

它以前有效，我能够将值（用于下拉列表和文本字段）插入数据库，但现在当我重新检查并尝试将下拉值插入数据库时，它不起作用。我只能插入文本字段值。我已经在这里和那里进行了更改，但仍然无法正常工作。有人可以指出我在这里做错了什么吗？

Answer 1

我认为问题是一旦对象被隐藏，它就不会随表单提交一起传递。

我建议的是运行隐藏字段列表。在提交表单之前将值放入这些字段中。然后您将始终拥有所有信息。在处理PHP中的表单时是否选择使用它由您决定。

Answer 2

您正在设置 select 并使用相同的 name 和 id 输入，您的数据库正在保存输入文本value 总是因为它是最后发送的字段，如果你通过 GET 发送它你有

your_page?radiocheck=on&p_author=B&p_author=text

您应该更改名称和 ID，即

<select name="p_author1" id="p_author1">
...
</select>

...

<input type="text" name="p_author2" id="p_author2" size="40" placeholder="Please enter here..">

HTML：根据选择显示下拉列表或文本字段的单选按钮

HTML: Radio button displaying dropdown list or textfield based on selections

html

javascript

textfield

radio-button

drop-down-menu