javascript - 切换 Select Tag 中出现的值

Question

如何切换此选择标记示例中出现的值...

如果我在列表中选择了人类代码，将出现的值为 556，如果我选择了动物代码，则选择框中出现的值将是 556。我应该怎么做？我需要在选择标签中添加 javascript 或其他内容吗？

<select name="test" id="test">
  <option value="556">Code for Humans</option>
  <option value="556">Code for Animals</option>
  <option value="556">Code for Elements</option>
</select>

Answer 1

没有直接的方法，因为这就是选择框的工作方式。

但是，您可以尝试在选择框上方放置一个文本框（将没有边框的文本框和选择框放在 div 中，并使文本框宽度充满边距和填充，以使文本框适合选择框）。

处理文本的焦点以显示下拉菜单，并在选择时在文本框中显示代码。因此，用户看到的是带有代码的文本框，而不是选定的值。

演示 - jsfiddle.net/5E7DS/

但是当然这不会像选择框一样。更改文本本身以显示代码也会更容易和正确。