How to real time display input value with jQuery?

问题

<input type="text" id="name" />
<span id="display"></span>

So that when user enter something inside "#name",will show it in "#display"

回答1:

You could simply set input value to the inner text or html of the #display element, on the keyup event:

$('#name').keyup(function () {
  $('#display').text($(this).val());
});

回答2:

A realtime fancy solution for jquery >= 1.9

$("#input-id").on("change keyup paste", function(){
    dosomething();
})

if you also want to detect "click" event, just:

$("#input-id").on("change keyup paste click", function(){
    dosomething();
})

if your jquery <=1.4, just use "live" instead of "on".

回答3:

$('#name').keyup(function() {
    $('#display').text($(this).val());
});

回答4:

The previous answers are, of course, correct. I would only add that you may want to prefer to use the keydown event because the changes will appear sooner:

$('#name').keydown(function() {
    $('#display').text($(this).val());
});

来源：https://stackoverflow.com/questions/1403776/how-to-real-time-display-input-value-with-jquery