jquery即点即改

表单页面

<td><span class="dian" id="<?php echo $val['g_id']?>"><?php echo $val['goods_price']?></span></td>

表单页面下的jquery

<script>
    $(function(){
        //击点即改
        $(document).on("click",".dian",function(){//给属性为class的属性一个点击事件
             var goods_price=$(this).html();//获取span标签里的值
             var id=$(this).attr('id');//获取span标签里属性对应的id
             var _this=$(this);//给span定义一个变量
            _this.parent().html("<input type=\"text\" value="+goods_price+" id="+id+" class='one'/>");//把td变成文本框
             var inp=$('.one').focus();//获取焦点
            //失去焦点
             inp.blur(function(){
                 var new_price=$(this).val();//获取文本框里的新值
                 var id=$(this).attr('id');//获取id
                 $.post("?r=home/upd",{id:id,price:new_price},function(msg){
                    if(msg==1){
                       inp.parent().html("<span class=\"dian\" id="+id+">"+new_price+"</span>");
                    }
                     else{
                       inp.parent().html("<span class=\"dian\" id="+id+">"+goods_price+"</span>");
                    }
                 });
             });

         });
    });
</script>

控制器层里方法

//击点即改
public function actionUpd(){
    $arr=\Yii::$app->request->post('price');
    $id=\Yii::$app->request->post('id');
    $data=\Yii::$app->db->createCommand("update goods set goods_price='$arr' where g_id='$id'")->execute();
     if($data){
         return 1;
     }
    else{
        echo 0;
    }

}