如何使用jquery在表单文本字段中输入文本时更新范围

I would like a span to update when a value is entered into a text field using jquery. My form field has a text box with the name "userinput" and i have a span with the id "inputval". Any help would be greatly appreciated.

我希望使用jquery在文本字段中输入值时更新范围。我的表单字段有一个名为“userinput”的文本框，我有一个id为“inputval”的span。任何帮助将不胜感激。

4 个解决方案

#1

UPDATE: although you marked this as the correct answer, note that you should use the keyup event rather than the change event or the keydown

更新：虽然您将此标记为正确答案，但请注意您应使用keyup事件而不是change事件或keydown

$(document).ready(function() {
    $('input[name=userinput]').keyup(function() {
      $('#inputval').text($(this).val());
    });
    });

#2

Try this. Be sure that you understand what is going on here.

尝试这个。确保你了解这里发生了什么。

// when the DOM is loaded:
$(document).ready(function() {
    // find the input element with name == 'userinput'
    // register an 'keydown' event handler
    $("input[name='userinput']").keydown(function() {
        // find the element with id == 'inputval'
        // fill it with text that matches the input elements value
        $('#inputval').text(this.value);
    }
}

#3

$(function() {
    $("input[name=userinput]").keydown(
      function() {
        $('#inputval').text(this.value);
      }
     )
})

#4

Try the following, you have to call again keyup() to trigger for the last char:

尝试以下操作，您必须再次调用keyup（）来触发最后一个char：

$(".editable_input").keyup(function() { 
    var value = $(this).val();
    var test = $(this).parent().find(".editable_label");
    test.text(value);
}).keyup();

#1