ThinkPHP5使用ajax异步删除图片

最新推荐文章于 2021-03-27 12:44:08 发布

时光清浅xyw

最新推荐文章于 2021-03-27 12:44:08 发布

阅读量587

点赞数

CC 4.0 BY-SA版权

本文链接：https://blog.youkuaiyun.com/xuyawei_xyw/article/details/81514923

本文介绍如何使用ThinkPHP5框架结合AJAX技术实现图片的异步删除功能，无需刷新页面即可更新网页内容，展示了具体的JavaScript和PHP代码实现。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

写代码有那么一两年了，多少也有一点儿感触，敲代码总是个累活儿，站在别人的肩膀上修轮子也是不那么轻松。罢了罢了，还是继续修轮子吧。

AJAX 最大的优点是在不重新加载整个页面的情况下，可以与服务器交换数据并更新部分网页内容。

ThinkPHP5使用ajax异步删除图片。整个页面地址不变，实现局部刷新。

代码展示：

<script type="text/javascript">
    function delete_image(o){
        if(!confirm('确定删除图片？')){
            return false;
        }
        var url="{:url('delete_image')}";
        var imgsrc=$(o).attr('id');
        $.ajax({
            url : url,
            type : "post",
            dataType : "json",
            data : {
                imgsrc:imgsrc
            },
            //如果返回成功
            success : function(data) {
                if(data.type == 1){
                    //执行删除操作
                    $(o).remove();                                                                    
                    alert('删除成功！');
                }else if(data.type == 2){
                    alert('删除失败！');
                }else{
                    alert('删除失败！');
                }
            }
         });
     }
</script>

提交到后台方法：

public function delete_image(){
    //接收获取的值
    $imgsrc = input('imgsrc');
    //拼接链接地址
    $imgsrc = DEL_UEDITOR.$imgsrc;
    if(file_exists($imgsrc)){
        if(@unlink($imgsrc)){
            //删除成功
            echo json_encode(array('type' => 1));
        }else{
            //删除失败
            echo  json_encode(array('type' => 2));
        }
    }else{
        //如果不存在，删除失败
        echo json_encode(array('type' => 3));
    }
}

点击删除按钮，显示弹框，提示删除成功或失败！