AJAX 本地提交 不跳转修改表格

使用jquery阻止a标签跳转,使用AJXA发起请求 后根据a标签的提示执行js语句来实现动态加载

A标签

 <a  href="{:url('portal/fapiao/print_id',['id'=>$so.id])}" class="ajax-click btn btn-primary btn-sm"  js="ts.parent().parent().parent().attr('class','bg-warning');var span=ts.parent().parent().prev().find('span:first');span.text('已开票');span.attr('class','label label-primary')"data-msg="确定已开票吗?">完成</a>
                                        <a  href="{:url('portal/fapiao/done_id',['id'=>$so.id])}" class="ajax-click btn btn-success btn-sm" js="ts.parent().parent().parent().attr('class','bg-success');var span=ts.parent().parent().prev().find('span').eq(1);span.text('已付款');span.attr('class','label label-success')" data-msg="确定已收款?">收款</a>
                                   

其中的 js 属性为eval执行js语句,其中 ajax-click 用于绑定点击事件来组织跳转a 标签的href,在函数中提前将$(this) 变为局部变量,在函数中使用,(因为ajax请求中$(this) 为请求本身)eval执行

$(".ajax-click").click(function(){
        event.preventDefault();//停止跳转
        var url=$(this).attr('href');
        var ts=$(this);
        var js=$(this).attr('js');
        var jugg=confirm($(this).attr('data-msg'));
        if(jugg){
            $.ajax({
                url:url,
                success:function(data){
                    console.log(data);
                    if(data.code){
                        // c=ts.parent().parent().parent().attr("class","info")
                        eval(js);
                        // console.log(c)
                        // window.location.href=data.url;
                    }
                }
            })
        } 
    })

发表回复