通过单击多个选择框中的项目来添加到HTML文本字段 [英] Adding to a HTML text field by clicking items in a multiple select box

问题描述

我想知道是否有可能，当我在HTML的多重选择框中单击一个项目时，它会进入另一个表单框中吗?基本上，当我单击某些内容时，我希望该文本成为表格.我尝试搜索，但似乎没有任何答案.

I'm wondering if it is possible that when I click on an item in a multiple select box in HTML that it goes into another form box? Basically, when I click on something I want that text to go into a form. I've tried searching, but nothing seems to have an answer.

<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 .这可能吗?

To give an example, when I click on the Java option, I want Java to go into the input box called taginput. If I then click on the Python option, I want Java Python. Is this possible?

推荐答案

这将与纯javascript 一起使用:

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

演示此处

Demo 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 + ' ';
}

演示此处

Demo here

这篇关于通过单击多个选择框中的项目来添加到HTML文本字段的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！