javascript - 从一个下拉列表中填写一些输入

Question

我有一个这样的jsp:

$("select[name='numbers']").change(function() {
  var str = $('#numbers option:selected').text();
  var ret = str.split(" ");
  var str1 = ret[0];
  var str2 = ret[1];
  var str3 = ret[3];
  $("first").val(str1);
  $("second").val(str2);
  $("last").val(str3);
}).change();

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<select id="numbers" name="numbers">
  <option value="1 2 3">1 2 3</option>
  <option value="4 5 6">4 5 6</option>
  <option value="7 8 9">7 8 9</option>
</select>
<br/>
<br/>
First: <input id="first" name="first" type="text"/><br/>
Second: <input id="second" name="second" type="text"/><br/>
Last: <input id="last" name="last" type="text"/>

我想做的是像这样填写输入:

• 如果选择了 1 2 3 选项，则在第一个输入中写入 1，在第二个输入中写入 2，在最后一个输入中写入 3；
• 如果选择了 4 5 6 选项，则在第一个输入中写入 4，在第二个输入中写入 5，在最后一个输入中写入 6；
• 如果选择了 7 8 9 选项，则在第一个输入中写入 7，在第二个输入中写入 8，在最后一个输入中写入 9；

我尝试过这种方式，但它不起作用:https://jsfiddle.net/L1xj7uge/我想我以错误的方式选择了下拉列表值，但我不知道如何解决。

Answer 1

Updated fiddle .

您应该在这些行的选择器中添加 id 符号 # 以引用 id 属性:

$("#first").val(str1);
$("#second").val(str2);
$("#last").val(str3);

而且 str3 的索引应该是 2 而不是 3，所以:

var str3 = ret[3];

应该是:

var str3 = ret[2];

希望这对您有所帮助。

$("select[name='numbers']").change(function() {
  var str = $('#numbers option:selected').text();
  var ret = str.split(" ");
  var str1 = ret[0];
  var str2 = ret[1];
  var str3 = ret[2];

  $("#first").val(str1);
  $("#second").val(str2);
  $("#last").val(str3);

}).change();

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<select id="numbers" name="numbers">
  <option value="1 2 3">1 2 3</option>
  <option value="4 5 6">4 5 6</option>
  <option value="7 8 9">7 8 9</option>
</select>
<br/>
<br/>
First: <input id="first" name="first" type="text"/><br/>
Second: <input id="second" name="second" type="text"/><br/>
Last: <input id="last" name="last" type="text"/>