jquery 即点即改

//在html中建立表单。

<table border="">
    <th>编号</th>
    <th>用户名</th>
    <th>密码</th>
    <?php foreach($i as $v){ ?>
    <tr>
        <td><?php echo $v['id']?></td>
        <td value="<?php echo $v['id']?>"><span class="name"><?php echo $v['name']?></span></td>
        <td><?php echo $v['pwd']?></td>
    </tr>
    <?php } ?>
</table>  

//以下是jquery代码。

<script>  

    $(document).on('click','span',function(){
         old_val=$(this).html();
        $(this).parent().html("<input type=\'text\' value="+old_val+">");
        $('input').focus();
    })  

    $(document).on('blur','input',function(){
        var obj=$(this);
        var id=$(this).parent().attr('value'); //获取要修改内容的id
        var val=$(this).val(); //获取修改后的值
        $.ajax({
            type:'post',
            url:'index.php/welcome/upd_pro',
            data:{
                id:id,
                val:val
            },
            success:function(msg){
                if(msg == 1){
                    $('td[value='+id+']').parent().html("<span class='name'>"+val+"</span>")
                }else{
                    obj.parent().html("<span class='name'>"+old_val+"</span>")
                }  

            }
        })
    })
</script>

1. //$('td[value='+id+']').parent().children().eq(2).html(" <td><span>"+val+"</span></td>")