如何将选择选项中的数据添加到最后选择的文本区域？答案

【问题标题】：How to add data from select options to last selected text area?如何将选择选项中的数据添加到最后选择的文本区域？
【发布时间】：2019-12-13 06:38:20
【问题描述】：

我有两个文本区域和一个下拉菜单（选择选项）。如果我从选择选项中选择任何数据，则需要将该值添加到最后选择的文本区域中。我做了一个脚本，但是如果从 textarea 中删除数据并添加它不起作用

var lastID;

$(function() {
  $("textarea").on("click", function() {
    lastID = $(this).attr("id");
  });
  
  $("#drp_dwn").change(function() {
    $("#" + lastID).append(this.value);
  }).add();
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<select id="drp_dwn">
  <option value="10">10</option>
  <option value="110">110</option>
  <option value="120" selected>120</option>
</select>

<textarea rows="4" cols="40" type="text" name="content" id="textArea1"></textarea>
<textarea rows="4" cols="40" type="text" name="content" id="textArea2"></textarea>

【问题讨论】：

尝试将click 更改为focusout
请澄清if remove data from textarea and adding its not working是什么意思

标签： javascript html

【解决方案1】：

试试这个：

var lastID;

$(function() {
  $("textarea").on("blur", function() {
    lastID = $(this).attr("id");
  });
  
  $("#drp_dwn").change(function() {
    $("#" + lastID).val($("#" + lastID).val()+this.value);
  }).add();
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<select id="drp_dwn">
  <option value="10">10</option>
  <option value="110">110</option>
  <option value="120" selected>120</option>
</select>

<textarea rows="4" cols="40" type="text" name="content" id="textArea1"></textarea>
<textarea rows="4" cols="40" type="text" name="content" id="textArea2"></textarea>

【讨论】：

它工作正常。谢谢你，我对此还有一个疑问。相反，我使用 id 我想用作类名，如：lastID = $(this).attr("class");在这种情况下，我怎样才能获得多个没有空格的类（.classname1.classname2）
你能解释清楚一点吗？没有空格是什么意思？

【解决方案2】：

代替这一行：

$("#" + lastID).append(this.value);

写这个

$("#" + lastID).val($("#" + lastID).val()+this.value);

由于 append 不会改变 textarea 的值，它会添加到 html

【讨论】：

我认为这不是问题所在。
这正是问题所在，这就是解决问题的方法。尝试测试它。
它可以工作，但我无法从下拉列表中添加相同的值。我的意思是如果我添加 '10' 并且我想再次添加 '10' - 它不起作用
我不知道下拉菜单是否是正确的工具。我要做的是首先放置一个空选项（“选择一个值”），并且每当用户选择一个值，比如说 10，通过 jQuery，我们会将所选值重置为（“选择一个值”）

【解决方案3】：

试试这个吧：

第一步： 您需要获取焦点文本区域值

var value = $("#" + lastID).val();

第二步： 添加新的选定值

$("#" + lastID).val(value+this.value);

工作代码：

var lastID;
$(function() {
    $("textarea").on("focus", function() {
        lastID = $(this).attr("id");
    });
    $("#drp_dwn").change(function () { alert(1);
    var value = $("#" + lastID).val();
    $("#" + lastID).val(value+this.value);
    }).add();
});

【讨论】：