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>

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

巴特西

jquery 即点即改

最新文章

热门文章