使用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;
}
}
})
}
})