如何用jQuery实时显示输入值?

时间:2009-09-10 07:14:09

标签: jquery event-handling

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

因此,当用户在“#name”中输入内容时,会在“#display”

中显示

4 个答案:

答案 0 :(得分:35)

您可以在text事件上将输入值设置为#display元素的内部htmlkeyup

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

答案 1 :(得分:14)

jquery的实时花式解决方案&gt; = 1.9

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

如果你还想检测“点击”事件,只需:

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

如果你的jquery&lt; = 1.4,只需使用“live”而不是“on”。

答案 2 :(得分:6)

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

答案 3 :(得分:1)

以前的答案当然是正确的。我只想补充一点,您可能希望使用keydown事件,因为更改会更快出现:

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