javascript - jQuery 更改输入值并将其显示为文本

Question

我正在努力解决以下问题。我有输入文本元素。我希望用户在那里输入内容，然后他的值显示为普通文本(输入应该消失)。

我搜索了一些解决方案，但没有一个对我有用。我尝试了什么(无论我提供什么功能，我都没有得到结果，我应该提供什么来获得我上面描述的效果以及如何实现它？):

$('input.modified').on('input', function(){
        (this).append('<p>some</p>');
});

或

$("input.modified").bind("propertychange change keyup paste input", function(){
    $(this).append("<p>dgdgd</p>");
});

或

$("input.modified").change(function(){
           $(this).css("visibility","hidden");
 }); //end change function 

如何使 .on() 或 .change() 等函数与我的代码一起工作？

---

感谢您的所有回答，但我无法将您的示例移到我的代码中:(

请验证这个 fiddle 我遗漏了什么:

[http://jsfiddle.net/w6242/][1]

Answer 1

检查这个 DEMO

HTML:

<input class="modified" type="text"/>
<p></p>

---

JS:

$("input.modified").change(function(){
           $('p').html($(this).val());
           $(this).css("visibility","hidden");
});