从输入动态添加选项

Adding option from input dynamically

本文关键字:选项 添加 动态 输入      更新时间:2023-09-26

每次我用onblur函数改变值时,我都试图将<input name="input">值添加到<select> <options>

在这种情况下,它确实改变了<input name="output">的值,但我想将它们添加多个,所以这就是为什么我要在select options中添加值。

这可能吗?

谢谢。

function add(form) {
		form.output.value = form.input.value;
	}
<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>

如果你的意思是在改变输入值后,添加它的值作为选项来选择,是的,这是可能的我已经编写了代码,参见下面的演示链接

https://jsfiddle.net/oxxqw71s/

和代码:

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

你可以像下面这样实现。

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>

<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]);
}