[JavaScript知识库]ajax即点即改

视图
<td>
  {if $val.up==1}
  <span style="color: red" data-id="{$val.id}" data-value="{$val.up}" class="state">是</span>
  {else/}
  <span style="color: blue" data-id="{$val.id}" data-value="{$val.up}" class="state">否</span>
  {/if}
</td>

ajax

<script>
  //点改
  $('.state').click(function (){
        var $id=$(this).attr('data-id');
        var $up=$(this).attr('data-value');
        var $that=$(this);
        $.ajax({
          url:"update",
          data:{id:$id},
          dataType:'json',
          success:function (e){
              if(e.code==200){
                  if($up==1){
                    $that.text('否');
                    $that.attr('data-value',0);
                    $that.css('color','blue')
                  }else {
                    $that.text('是');
                    $that.attr('data-value',1);
                    $that.css('color','red')
                  }
              }else {
                alert(e.message);
              }
          }
        })
  })
</script>

路由

Route::get('update', 'Admin/update');

控制器

public function update(Request $request)
{
    $id = $request->param('id');
    $obj = new Home();
    $data = $obj->get($id);
    if ($data->up == 1) {
        $data->up = 0;
    } else {
        $data->up = 1;
    }
    $res = $data->save();
    if ($res) {
        return json([
            'code' => 200,
            'message' => '修改成功',
            'data' => '',
        ]);
    }
    return json([
        'code' => 400,
        'message' => '修改失败',
        'data' => '',
    ]);
}

模型获取id

public function get($id){
    return $this->find($id);
}