免费PHP万能建站系统_社区团购SaaS_商城系统_软件开发_虚拟币交易所系统_矿机系统_微信钻石投票系统_成品源码

标题: jQuery+ajax实现无刷新删除 [打印本页]

作者: admin_2    时间: 2014-11-16 14:55
标题: jQuery+ajax实现无刷新删除
jax是局部刷新。用jQuery来实现,会简化很多。
下面进行详细的说明,结合一个ajax删除的案例来进行。
首先看html界面的代码:
[mw_shl_code=applescript,true]<a href="javascript:;" ><img src="images/admin/delete-icon.png" border="0" /></a>[/mw_shl_code]

这个一个图片链接,表示删除。它并不跳转到某个界面,而是点击时出发click事件。
click事件执行delete_order()方法。这个方法中传递了一个参数,订单号。通过这个参数,可以去执行相应的删除操作。
下面jQuery代码:

[mw_shl_code=applescript,true]<script>
    function delete_order(order_id){   
        confirm_ = confirm('This action will delete current order! Are you sure?');
        if(confirm_){
            $.ajax({
                type:"POST",
                url:'index.php/admin/order/del/'+order_id,
                success:function(msg){
                    //alert("test order");
                    //all delete is success,this can be execute
                    $("#tr_"+order_id).remove();
                }
            });
        }
    };
</script>[/mw_shl_code]
首先出发一个提示框,确认删除吗?
如果确认的话,执行ajax操作。
在jQuery中,有一个$.ajax()的方法。
这里有三个参数,一个是类型,这里面用的是POST,
第二个是地址,这个很关键,它负责将数据,传送到后台服务器去执行。
第三个参数是一个回调函数,如果执行删除成功,就会执行的操作。这个时候,就可以执行一些动作,比如将这条已删除的记录,移除。结合的是下面的这行代码。为没条记录,赋予一个动态的id,作为删除时使用的依据。这里要注意的是,必须后台执行的所有都成功之后,才会执行这个回调函数。
[mw_shl_code=applescript,true] <tr id="tr_<?php echo $item['order_id']; ?>"></tr>[/mw_shl_code]

作者: a52451793    时间: 2014-11-16 14:55
看一下,但是没看明白
作者: qing99    时间: 2014-11-17 13:03
YIDACMS技术论坛我在这学到了很多东西
作者: garylee1988    时间: 2014-11-21 05:47
不错,今天是开眼了





欢迎光临 免费PHP万能建站系统_社区团购SaaS_商城系统_软件开发_虚拟币交易所系统_矿机系统_微信钻石投票系统_成品源码 (https://www.ourphp.net/club/) Powered by Discuz! X3.2