ThinkChat🤖让你学习和工作更高效,注册即送10W Token,即刻开启你的AI之旅 广告
# layer_hplus.js(修订) > 参考:第71讲_后台模型管理之预览模型 > 时间:2018.6.18 [TOC] ## Layer插件无刷新显示 > 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){ var icon_num = (obj.status == 200) ? 1 : 2; if (obj.status == 200 || obj.status == 202) { // layer弹框信息 layer.open({ title:['温馨提示','font-size:18px;font-weight:bold;color:green;'], content: obj.msg, btn: ['确认'], icon:icon_num, shade: 0, yes: function(index, layero){ if (obj.url) { location.href = obj.url; //跳转指定地址 }else{ layer.close(index); } }, cancel: function(){ if (obj.url) { location.href = obj.url; //跳转指定地址 }else{ layer.close(); } }, }); } }, error:function(obj){ layer.alert('网络故障'); }, }); return false; }); ~~~ ## layer简单异步跳转 ### 功能介绍 融合TP自带新开页面跳转与layer异步提交,实现简单异步跳转 ### 注意事项 ~~~ contentType:"application/x-www-form-urlencoded", ~~~ > $.ajax 中的contentType和dataType 参考网页:https://www.cnblogs.com/htoooth/p/7242217.html contentType 主要设置你发送给服务器的格式 dataType 设置你收到服务器数据的格式 在 jquery 的 ajax 中, contentType都是默认的值:application/x-www-form-urlencoded 这种格式的特点就是,name/value 成为一组,每组之间用 & 联接,而 name与value 则是使用 = 连接。 如: wwwh.baidu.com/q?key=fdsa&lang=zh 这是get 而 post 请求则是使用请求体,参数不在 url 中,在请求体中的参数表现形式也是: key=fdsa&lang=zh的形式。 ### 代码实现 ~~~ $(document).ready(function(){ // 复选框iCheck插件 $('input[type="checkbox"]').on('ifChecked',function(){ $(this).val('1'); }); $('input[type="checkbox"]').on('ifUnchecked',function(){ $(this).val('0'); }); // 单选框iCheck插件 // $('input[type="radio"]').on('ifChecked',function(){ // $(this).val('1'); // }); // $('input[type="radio"]').on('ifUnchecked',function(){ // $(this).val('0'); // }); // 隐藏选项卡 $('.nav-tabs li').click(function(){ if ($(this).attr('id') != 'showtab') { $('#showtab').attr('style','display:none'); } }); // ************************* 删除链接提示信息 sta ******************************* $("a[name='delete']").click(function(){ // 获取跳转地址 var url = $(this).attr('href'); layer.confirm('您确定要删除数据吗',{icon:3, title:'提示'},function(index){ // layer.alert(index);return false; // 异步提交处理 $.ajax({ type:"POST", url:url, dataType:"json", contentType:"application/x-www-form-urlencoded", data:null, success:function(obj){ var icon_num = (obj.status == 200) ? 1 : 2; if (obj.status == 200) { layer.open({ title:['温馨提示','font-size:18px;font-weight:bold;color:green;'], content: obj.msg, icon:icon_num, btn: ['确认'], shade: 0, yes:function (index,layero) { if (obj.url) { location.href = obj.url; //跳转指定地址 }else{ layer.close(index); } }, cancel:function(){ if (obj.url) { location.href = obj.url; //跳转指定地址 }else{ layer.close(); } } }); } }, error:function(){ layer.alert('网络故障'); } }); }); return false; }); // ************************* 删除链接提示信息 end ******************************* }); ~~~