允许用户编辑和保存文本

Question

我是编程新手。感谢stackoverflow，我在学习了数百篇文章后成功创建了登录和注册页面。

我正在寻找允许用户在其信息中心上编辑文字的内容。

第1步：用户点击某些文字旁边的修改按钮。
第2步：文本变为输入字段
第3步：用户编辑文本并按enter键 第4步：旧文本应更改为新编辑的文本。那就是它！

如果有人能提供帮助我真的很感激！谢谢！

Answer 1

点击 here for JSFIDDLE DEMO

OR

＆＃13;

＆＃13;

$(document).delegate('#act','click',function(){
       if($('#edit').is(':hidden')){
                console.log('----');
               $('#edit').val($('#view').html()).show();
               $(this).html('Done');
               $('#view').hide();

       }else{
           $('#view').html($('#edit').val()).show();
           $('#edit').hide();
           $(this).html('Edit')
       }

});

＆＃13;

input#edit,span#view{
     width:500px;
     height:50px;
    font-size:30px;
}

button#act{
      width:200px;
      height:40px;
}
.actor{
    margin-top:20px;
}

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

    <div>
    <span id="view">click me</span>
    <input id="edit" type="text" style="display:none;" />
    </div>
    <div class="actor">
    <button id="act" >Edit</button>
    </div>

＆＃13;

＆＃13;

＆＃13;