jq ajax 异步删除

最新推荐文章于 2024-05-25 09:36:49 发布

juner_ge

最新推荐文章于 2024-05-25 09:36:49 发布

阅读量1.1k

点赞数

CC 4.0 BY-SA版权

分类专栏： js

本文链接：https://blog.youkuaiyun.com/juner_ge/article/details/46348009

js 专栏收录该内容

3 篇文章

订阅专栏

本文介绍如何利用jQuery的AJAX方法实现网页上的异步删除操作，避免页面刷新，提高用户体验。

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

1、html页面

<a href="javascript:;" onclick="batch_drop('{tp:U('News/batch_drop')}')" class="btn btn-danger radius"><i class="icon-trash"></i> 批量删除</a>


<a title="删除" href="javascript:;" onclick="drop(this,'{tp:U('News/drop','id='.$v[id])}')" class="ml-5" style="text-decoration:none;">

2、jq代码

/*
 * ajax 单条删除
 * @obj 操作的对象
 * @url 请求的地址
 */
function drop(obj,url){
		layer.confirm('确认要删除吗？',{icon: 3},function(){
			$.getJSON(url, function(data){
				if(data.done){
					$(obj).parents("tr").remove();
				}
				layer.msg(data.msg,{icon: 5,time:'2000'});
			});
		});
	}
/*
 * ajax 批量删除
 * @url 请求的地址
 */
function batch_drop(url){
	if($("input[name='all[]']:checked").length == 0){
		layer.msg('未选中任何记录！',{icon: 0,time:'2000'});
        return false;
    }
	layer.confirm('确认要删除吗？',{icon: 3},function(){
		var items = '';
	    $("input[name='all[]']:checked").each(function(){
	        items += this.value + ',';
	    });
	    items = items.substr(0, (items.length - 1));
		$.getJSON(url, {ids:items}, function(data){
			layer.msg(data.msg,{icon: 5,time:'2000'});
			setInterval("loca()", 1500);//让页面延迟刷新
		});
	});
}
function loca(){
	window.location.replace(location.href);
}

3、php代码

 /**
     * 单条删除
     */
    public function drop(){
        $newsModel = M('Notice');
        $id=I('get.id');
        if($newsModel->where(array('id'=>$id))->delete()){
            $result = array('done' => true , 'msg' => '删除成功');
        }else{
            $result = array('done' => false , 'msg' => '删除失败');
        }
        echo json_encode($result);
    }
    /**
     * 批量删除
     */
    public function batch_drop(){
        $newsModel = M('Notice');
        $ids=I('get.ids');
        if($newsModel->where(array('id'=>array('in',$ids)))->delete()){
            $result = array('done' => true , 'msg' => '删除成功');
        }else{
            $result = array('done' => false , 'msg' => '删除失败');
        }
        echo json_encode($result);
    }

注意：本例用到layer插件，需要引入