Làm thế nào để giá trị đầu vào hiển thị thời gian thực với jQuery?

Question

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

Vì vậy mà khi người dùng nhập một cái gì đó bên trong "#name", sẽ hiển thị nó trong "#display"

Answer 1

Bạn chỉ có thể đặt giá trị đầu vào cho khu vực nội text hoặc html của phần tử #display, trên keyup sự kiện:

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

Answer 2

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

Answer 3

Những câu trả lời trước đó, tất nhiên, chính xác. Tôi sẽ chỉ thêm rằng bạn có thể muốn thích sử dụng các sự kiện keydown vì những thay đổi sẽ xuất hiện sớm hơn: giải pháp

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

Answer 4

Một thời gian thực ưa thích cho jquery> = 1,9

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

nếu bạn cũng muốn phát hiện sự kiện "nhấp", chỉ:

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

nếu jquery < = 1.4, chỉ cần sử dụng "live" thay vì "on".