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たいとします。次にオプションをクリックすると、. これは可能ですか？JavataginputPythonJava Python

4

4 に答える 4

2

これはプレーンな javascriptで動作します:

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

デモはこちら

重複を避ける2 番目のバージョン:

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 に答える