# jQuery异步无刷新跳转 ### 第一步，引入jQuery和layUI相关js文件 ### 第二步，编写自定义js文件，代码如下： ~~~ // Layer插件无刷新显示（当前页面弹出信息提示框-无刷新） $(document).on('submit','form[data-type=ajax]',function(obj){ // 获取表单数据 var url = $(this).attr('action'); var data = $(this).serializeArray(); // 异步提交处理 $.ajax({ type:'POST', dataType:'json', url:url, data:data, success:function(obj){ if (obj.status == 200 || obj.status == 202) { // layer弹框信息 layer.open({ title:['温馨提示','font-size:18px;font-weight:bold;color:green;'], content: obj.msg, btn: ['确认'], shade: 0, yes: function(index, layero){ location.href = obj.url; //跳转指定地址 }, cancel: function(){ location.href = obj.url; //跳转指定地址 }, }); } }, error:function(obj){ layer.alert('网络故障'); }, }); return false; }); // 融合TP自带新开页面跳转与layer异步提交，实现简单异步跳转 $(document).ready(function(){ $("a[name='delete']").click(function(){ // 获取跳转地址 var url = $(this).attr('href'); // 异步提交处理 $.ajax({ type:'POST', dataType:'json', url:url, data:null, success:function(obj){ if (obj.status == 200 || obj.status == 202) { // layer弹框信息 layer.open({ title:['温馨提示','font-size:18px;font-weight:bold;color:green;'], content: obj.msg, btn: ['确认'], shade: 0, yes: function(index, layero){ location.href = obj.url; //跳转指定地址 }, cancel: function(){ location.href = obj.url; //跳转指定地址 }, }); } }, error:function(obj){ layer.alert('网络故障'); }, }); return false; }); }); ~~~ ### 第三步，控制器中返回json格式（建议配合自定义助手函数，更方便） ~~~ public function delete($id = 0,$tab = 1){ if (Db::name('category')->where('id',$id)->delete()) { return success('删除分类成功',url('index',['tab'=>$tab])); }else{ $this->error('删除分类失败',url('index',['tab'=>$tab])); } } ~~~ #### 注意事项 ~~~ 1、return success('删除分类成功',url('index',['tab'=>$tab])); 2、$this->success('删除分类成功',url('index',['tab'=>$tab])); ~~~ 1、表示调用通用函数 2、表示调用对象中的方法