的jquery/JavaScript的转换纯文本消息转换为文本输入字段

Question

我有以下请求：

上创建的编辑触发点击时转变成一个文本输入元件的纯文本字段。当离开输入元素时，文本将被存储在数据库中，并且该字段将被转换回带有新内容的纯文本字段。当在输入中按ESC时，最近的值被恢复。为此，我使用以下代码：

<div id="value"><span id="text">some text</span></div> 
<div id="trigger">[EDIT]</div> 
<div style="display: none;" id="storage"> 
    <input type="text" id="input" value="some text"/> 
</div> 

<script type="text/javascript"> 
    $('#trigger').click(function() { 
    var t = $('#text').detach(); 
    var e = $('#input').detach(); 

    $('#storage').append(t); 
    $('#value').append(e); 
    e.focus(); 
    }); 

    $('#input').blur(function() { 
    var t = $('#text').detach(); 
    var e = $('#input').detach(); 

    if (t.text() != e.val()) { 
     $.getJSON(...); 
    } 

    $('#storage').append(e); 
    $('#value').append(t); 
    }); 

    $('#input').keyup(function(event) { 

    if (event.which == 27) { 
     $('#input').val($('#text').text()); 
     $('#input')[0].blur(); 
    } 

    }); 

</script> 

感谢@nnnnnn这现在可以工作。但是，有没有更简单的方法来实现这一点使用一些预先存在的API函数？

非常感谢。

Answer 1

使用jQuery编辑这里是演示的链接

： http://www.appelsiini.net/projects/jeditable/default.html

对插件的主页 http://www.appelsiini.net/projects/jeditable

Answer 2

我开发了一个插件，你需要什么：

$.convertTo

我希望这会有所帮助，问候。