ボタンの入力値を更新するJquery

Question

以下のコードの場合、ボタンをクリックすると、テキストの名前が更新されます。すなわち、ヒスノイズ的に、ヘルソス的に、寛解して、 であるが、その代わりに、電流は、ヒソムス、hellotomsally、suptomsallyである。 テキストをhi、hellop、supのままにして、名前を更新する方法はありますか？ textarea

$(".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="sally" class="done" \> </td> 
 
    <td>text1<textarea class="text" data-value="hi">hitom</textarea> </td> 
 
    <td>text2<textarea class="text" data-value="hello">hellotom</textarea> </td> 
 
    <td>text3<textarea class="text" data-value="sup">suptom</textarea> </td> 
 

 
    </tr> 
 
</table> 
 
<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

テキストエリアの値を実際に連結しています。 data-value属性の値を修正すると、完了します。

$(".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="sally" class="done" \> </td> 
 
    <td>text1<textarea class="text" data-value="hi">hitom</textarea> </td> 
 
    <td>text2<textarea class="text" data-value="hello">hellotom</textarea> </td> 
 
    <td>text3<textarea class="text" data-value="sup">suptom</textarea> </td> 
 

 
    </tr> 
 
</table> 
 
<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 2

にdata-valueが間違って含まれているあなたは、あなたが先頭に追加したい値のみにごdata-valueを変更する必要が 感謝

$(".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="sally" class="done" \> </td> 
 
    <td>text1<textarea class="text" data-value="hitom">hitom</textarea> </td> 
 
    <td>text2<textarea class="text" data-value="hellotom">hellotom</textarea> </td> 
 
    <td>text3<textarea class="text" data-value="suptom">suptom</textarea> </td> 
 

 
    </tr> 
 
</table> 
 
<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 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).attr("data-value").replace(/tom/g,"")+set); 
 
    }) 
 
    } 
 
});

<table> 
 
    <tr> 
 

 
    <td> 
 
    <input type="button" value="ok" class="ok"></td> 
 
    <td>done<input type="text" value="sally" class="done" \> </td> 
 
    <td>text1<textarea class="text" data-value="hitom">hitom</textarea> </td> 
 
    <td>text2<textarea class="text" data-value="hellotom">hellotom</textarea> </td> 
 
    <td>text3<textarea class="text" data-value="suptom">suptom</textarea> </td> 
 

 
    </tr> 
 
</table> 
 
<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>