2016-10-15 15 views
1

onblurの値を変更するたびに、の値を<select><options>に追加しようとしています。入力から動的にオプションを追加する

この場合、<input name="output">の値が変更されますが、複数の値を追加したいので、値をselectoptionsに追加することを検討しています。

これは可能ですか?

ありがとうございました。あなたはそれを選択するためのオプションとして、値の入力値を変更した後、追加することを意味している場合、私は、コードがリンク

以下

でデモを参照してください書いてきました

function add(form) { 
 
\t \t form.output.value = form.input.value; 
 
\t }
<form> 
 
    <input name="input" type="text" value="" onblur="add(this.form);"> 
 
    <input tabindex="-1" name="output" type="text" value=""> 
 
    <select multiple> 
 
    <option>Test</option> 
 
    </select> 
 
</form>

答えて

2

、いやそれは可能ですhttps://jsfiddle.net/oxxqw71s/

やコード:

$("select").append($('<option>', {value:v, text:v})); 
+0

ありがとうございました。はい、これは私が探していたものです。それを逆にする機会はありますか?もし私が誤って選択した場合に値を選択したいのであれば、それはちょうどの場合です。選択値の変化は、単に名前の宣言関数は、(v)は { // vはselectchanged 機能以下のような をselectchanged JavaScriptで、その後 を選択するには、このattrの のonchange = "selectchanged(this.value)" を追加したとき –

+0

はい得ることができます選択 の値} – Farhad

1

以下のように実装できます。

function add(val){ 
 
    var data = val.input.value; 
 
    val.output.value = data; 
 
    
 
    var option = document.createElement("option"); 
 
    option.text = data; 
 
    val.opt.add(option, val.opt[0]); 
 
    
 
}
<form> 
 
    <input name="input" type="text" value="" onblur="add(this.form);"> 
 
    <input tabindex="-1" name="output" type="text" value=""> 
 
    <select multiple name="opt"> 
 
    <option>Test</option> 
 
    </select> 
 
</form>

HTML

<form> 
    <input name="input" type="text" value="" onblur="add(this.form);"> 
    <input tabindex="-1" name="output" type="text" value=""> 
    <select multiple name="opt"> 
    <option>Test</option> 
    </select> 
</form> 

JS

function add(val){ 
    var data = val.input.value; 
    val.output.value = data; 

    var option = document.createElement("option"); 
    option.text = data; 
    val.opt.add(option, val.opt[0]); 

} 
関連する問題