javascript - Jquery更新输入字段值[用新值替换旧值]

Question

对于当前代码，当单击按钮时，它将从完成的输入中获取值并将其分别显示到 3 个输入字段。

假设我想更改已完成输入字段中的值，当该值更新时，3 个输入字段中的旧值将被新值替换。现在，更新后的值只是添加到原始值之后，而不是替换它。我的代码有什么问题吗？

$(".ok").on('click', function() {
var set = $(this).closest('tr').find('.done').val();
if ( set ){
    $(this).closest('tr').find('.text').each(function(){
        $(this).val( $(this).val() + set );
    })
}
});

<table>
  <tr>
 
    <td>
      <input type="button"  value="ok" class="ok"></td>
    <td>done<input type="text" value="100" class="done" \> </td>
    <td>text1<textarea class="text">hi</textarea> </td>
    <td>text2<textarea class="text">hello</textarea> </td>
    <td>text3<textarea class="text">sup</textarea> </td>

  </tr>
  <script src="https://code.jquery.com/jquery-3.1.1.slim.min.js" integrity="sha384-A7FZj7v+d/sdmMqp/nOQwliLvUsJfDHW+k9Omg/a/EheAdgtzNs3hpfag6Ed950n" crossorigin="anonymous"></script>

Answer 1

$(".ok").on('click', function() {
  var set = $(this).closest('tr').find('.done').val();
  if (set) {
    $(this).closest('tr').find('.text').each(function() {
      $(this).val($(this).attr("data-value") + set);
    })
  }
});

<table>
  <tr>

    <td>
      <input type="button" value="ok" class="ok"></td>
    <td>done<input type="text" value="100" class="done" \> </td>
    <td>text1<textarea class="text" data-value="hi">hi</textarea> </td>
    <td>text2<textarea class="text" data-value="hello">hello</textarea> </td>
    <td>text3<textarea class="text" data-value="sup">sup</textarea> </td>

  </tr>
  <script src="https://code.jquery.com/jquery-3.1.1.slim.min.js" integrity="sha384-A7FZj7v+d/sdmMqp/nOQwliLvUsJfDHW+k9Omg/a/EheAdgtzNs3hpfag6Ed950n" crossorigin="anonymous"></script>

1. 在每个文本区域添加数据-*。
2. 使用该值而不是实际值