css部分：

.tab{
　　border:solid 1px #00aaee;
　　text-align: left;
　　margin:20px;
}
.tab tr{
　　border-top: solid 1px #00aaee;
}
.tab tr td,.tab tr th{
　　border-right: solid 1px #00aaee;
　　height:35px;
　　width: 200px;
　　padding: 0 5px;
}
.tab tr th{
　　background: #00aaee;
　　color:#fff;
}
.tab input{
　　width: 90%;
　　margin: 0;
　　padding: 3px ;
　　border: solid 1px #00aaee;
}

html部分：

<table class="tab">    <tr>        <th>编号</th><th>名称</th>    </tr>    <tr>        <td>1</td><td>辣条</td>    </tr>    <tr>        <td>2</td><td>牛奶</td>    </tr>    <tr>        <td>3</td><td>苹果</td>    </tr>    <tr>        <td>4</td><td>葡萄</td>    </tr></table>

js部分:$('.tab td').bind('click',(function(){    if($('input').length > 0){        $('input').parent().html($('input').val());    }    var current = $(this);    if(current.children('input').length > 0){        return false;    }    var txt = current.html();    current.html('');    var inputObj  = $("<input type='text'>").val(txt).appendTo(current);    inputObj.click(function(){        return false    })}));