Обновить текст по изменению значения textarea w/jQuery

У меня есть текстовое поле. Мне нужно обновить текст в div, когда значение в textarea будет изменено с помощью набрав в нем или поместив в него некоторое значение с помощью другой функции jQuery или вставить.

$(document).ready(function(){
    function myFunc() {
        var input = $("#myTxt").val();
        $("#txtHere").text(input);
    }       
    myFunc();

    // EDIT BELOW -- this will update while typing
    $("#myTxt").keyup(myFunc);

});

<textarea id="myTxt"></textarea>
<div id="txtHere"></div>

Он загружает значение при загрузке страницы, но я не уверен, что использовать для проверки значения в текстовом поле...

Ответ 1

$(document).ready(function(){
    function myFunc(){
        var input = $("#myTxt").val();
        $("#txtHere").text(input);
    }       
    myFunc();

    //either this
    $('#myTxt').keyup(function(){
        $('#txtHere').html($(this).val());
    });

    //or this
    $('#myTxt').keyup(function(){
        myFunc();
    });

    //and this for good measure
    $('#myTxt').change(function(){
        myFunc(); //or direct assignment $('#txtHere').html($(this).val());
    });
});

Ответ 2

Для textarea функция .change вызывается только тогда, когда textarea теряет фокус.

Я нашел свое решение по этой ссылке: Как связать с событием изменения текстового поля в jQuery?

$('#textareaID').bind('input propertychange', function() {
      $("#yourBtnID").hide();

      if(this.value.length){
        $("#yourBtnID").show();
      }
});

Это отлично сработало для меня. Он обрабатывает любые изменения, включая вставку.

Плюс this.value.length - это аккуратный способ увидеть, очищено ли текстовое поле.

Ура!

Ответ 3

$(document).ready(function(){
   $('#myTxt').keypress(function(e){
       $('#txthere').html($(this).val());
   });
});

Это сделает это.

Ответ 4

Вы можете использовать событие delegate следующим образом:

$('body').delegate('#myTxt', 'keyup change', function(){
   $('#txtHere').text(this.value);
});

Это должно обновить текст сразу после ввода текстового поля или вставки.

Ответ 5

Используйте обработчик события изменения (активируется, когда содержимое изменяется, а текстовая область теряет фокус):

$('#myTxt').change(function(){
    var input = $("#myTxt").val();
    $("#txtHere").text(input );
});

Ответ 6

$(document).delegate('#myTextareaId','input', function() {
  $('#myTextId').html($(this).val());
});