具有输入单选和一个具有相同属性名称的文本输入的 HTML 表单

Question

我正在尝试做一个带有几个选项的单选按钮组，最后一个选项将是文本输入字段“其他”。像这样的东西：

我想这样做，所以提交时，调用的网址是

应用程序：//配置？服务器=...

服务器应该包含服务器属性的值，无论它来自单选按钮之一还是来自输入组

我尝试这样做

<form method="GET" action="app://configuration">
  Select server <br>
  <input type="radio" name="server" value="1">Production<br>
  <input type="radio" name="server" value="2">Test<br>
  <input type="radio" name="server" value="3">Localhost<br>
  <input type="radio" name="server" value="">Other <input type="text" name="server" />
  <input type="submit" value="Submit">
</form>

我name对单选按钮和输入字段使用了相同的属性，结果是name当按下提交时，（服务器）被复制。

我明白为什么它不能以当前的方式工作。知道如何用 javascript 实现这样的事情吗？（请不要使用像jquery这样的第三方）

我无权更改服务器代码，因此我无法使用不同的属性名称，因为服务器不会知道它......

Answer 1

尝试这个纯javascript（修改你的html代码）

function changeradioother() {
  var other = document.getElementById("other");
  other.value = document.getElementById("inputother").value;
}

<input type="radio" name="server" value="1">Production<br>
<input type="radio" name="server" value="2">Test<br>
<input type="radio" name="server" value="3">Localhost<br>
<input type="radio" name="server" id="other" value="other">Other <input id="inputother" type="text" onchange="changeradioother()" />
<input type="submit" value="Submit">

我向最后一个单选按钮和输入框添加了一个 id。