1

我想知道当我单击 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. 这可能吗？

4

4 回答 4

2

这将使用纯 javascript工作：

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

演示在这里

避免重复的第二个版本：

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

演示在这里

于 2013-09-13T14:30:02.343 回答
1

您可以这样做，它会找到选定的选项，创建一个文本数组，然后将其添加到文本输入中。

$("select[name=tags]").change(function() {
    var arrSelected = $(this).find("option:selected").map(function() {
        return $(this).text();
    }).get();

    $("input[name=taginput]").val(arrSelected);
});

演示：http: //jsfiddle.net/SyAN6/

于 2013-09-13T14:30:55.973 回答
0

你可以看到这个小提琴：

http://jsfiddle.net/ppSv4/

$('select option').on('click',function(){
    $('#texthere').val( $(this).attr('value') );
});
于 2013-09-13T14:28:59.880 回答
0

您可以使用 jquery 执行此操作，只需检查多选框中的更改，然后将新更改的数据添加到输入字段。

您也可以使用 jsFiddle http://jsfiddle.net/eUDRV/85/

$("#values").change(function () {
    var selectedItem = $("#values option:selected");
    $("#txtRight").val( $("#txtRight").val() +  selectedItem.text());
});
于 2013-09-13T14:30:03.330 回答