Получение значения входного текстового поля и добавление его в текстовое поле

Вы можете попробовать что-то вроде этого:

<script>

    $(function() {

        $( "#name" ).change(function() {
            $("#textAreaId").append($( "#name" ).val());  
        });

     });

</script>    

Надеюсь, это поможет вам!

Попробуй это:

$('input').keyup(function() {
    $('textarea').text($(this).val());
});

Вы знакомы с AJAX? Если да, то это лучший подход к использованию.

Изменить: для вашей ситуации это не похоже, что вы правильно настраиваете форму. Формы предназначены для представления группы информации, а затем помещают эту информацию в другое место - туда, куда ей нужно идти. Следовательно, я переместил вашу textarea вне формы.

Я бы рекомендовал настроить ваш HTML так:

<form id="target" action>
    <label>First Name:</label>
    <input type="text" id="fName" />
    <br /><br />
    <label>Last Name:</label>
    <input type="text" id="lName" /><br><br>
    <input type="submit" value="Submit"/>
    <br /><br />
</form>
<textarea id="message"></textarea>

И вот jQuery, который я использовал:

$('form#target').submit(function(e) {
    e.preventDefault();
    var message, firstName, lastName;

    message = "Dear ";
    firstName = $('input#fName').val();
    lastName = $('input#lName').val();

    message += firstName + ' ';
    message += lastName + ',';
    $('textarea#message').text(message);
});

Примечание. Я изменил свойства class на id потому что id предназначен для уникальных тегов. Если у вас было несколько элементов, которые вы хотели захватить сразу с помощью jQuery, классы были бы способ пойти.

Предварительный просмотр здесь.

Надеюсь, это поможет!

Так что это обманчиво сложный вопрос, потому что вы пытаетесь обновить ЧАСТЬ текста внутри текстового поля. Внутри текстовой области нет структуры, это просто "текст". Так что то, что вы просите, похоже на наличие ведра шаров пинг-понга, написание имени на одном из них, смешивание ведра, а затем сообщение кому-то, что они должны постоянно заменять именованный шар новым.

Хотя есть способы сделать это, он поднимает кучу вопросов, на которые я сомневаюсь, что вы хотите ответить - что, если они удаляют первую строку? Что делать, если они меняют свое имя прямо в текстовом поле? Что делать, если они пишут свое имя несколько раз в текстовой области? Что делать, если их браузер использует язык, который пишет сверху вниз?

Если вы не готовы ответить на эти запросы (и если вы, вероятно, начинаете более конкретный вопрос), я рекомендую изменить подход. Например, я сомневаюсь, что вы хотите, чтобы у них была возможность изменить первую строку. Поэтому вместо этого вы можете структурировать свою форму следующим образом:

<form>
  <label>First Name: <input class="first-name" /></label>
  <label>Last Name: <input class="last-name" /></label>
  <aside class="salutations">Dear <span class="first-name-salutation"></span></aside>
  <textarea class="message"></textarea>
</form>

Заметьте, что я переехал свои входы в ярлыки (это технически правильный способ сделать это без использования идентификаторов), удален <br> теги (вы должны использовать CSS для этого) и переместил приветствие в не редактируемый пользователе текст. Тогда ваш javascript может быть просто

$(function(){
  $('input.first-name').on('input', function(){
    $('.first-name-salutation').text($(this).text());
  });
})

А затем добавьте строку "Dear "+firstName в сообщение на сервере.

В качестве отступления я укажу, что это не 2009 год, и нет оснований для использования jquery непосредственно для таких вещей, когда есть отличные рамки, которые не заставляют вас делать так много вещей вручную, как Knockout и Angular.