javascript - 通过单击多选框中的项目添加到 HTML 文本字段

Question

我想知道是否有可能当我在 HTML 的多选框中单击一个项目时它会进入另一个表单框？基本上，当我点击某个东西时，我希望该文本进入一个表单。我试过搜索，但似乎没有任何答案。

<form name="input" method="post" action="#">
Display Tag:<input type="text" name="taginput">
<input type="submit" value="Go">
<select name="tags" multiple>
    <option value="C#">C#</option>
    <option value="Java">Java</option>
    <option value="Javascript">Javascript</option>
    <option value="PHP">PHP</option>
    <option value="Android">Android</option>
    <option value="jQuery">jQuery</option>
    <option value="C++">C++</option>
    <option value="Python">Python</option>
    <option value="HTML">HTML</option>
    <option value="MySQL">MySQL</option>
</form>

举个例子，当我点击Java选项时，我想让Java进入名为taginput的输入框。如果我随后单击 Python 选项，我需要 Java Python。这可能吗？

Answer 1

这将适用于 plain javascript:

var sel = document.getElementsByName ('tags')[0];
sel.onclick = function () {
    document.getElementsByName ('taginput')[0].value = this.value;
}

演示 here

第二个版本避免重复:

var sel = document.getElementsByName('tags')[0];
var choosen = [];
sel.onclick = function () {
    var is_there = !!~choosen.indexOf(this.value);
    if(is_there){return false;};
    choosen.push(this.value);
    document.getElementsByName('taginput')[0].value += this.value + ' ';
}

演示 here