问题:
公司项目最近在用easyui写后台管理系统,发现dialog使用后总会报出莫名奇妙的问题
1.打开多次后数据显示上一次的,表单提交错误或者获取数据错误
2.来回跳转后,会有打开其它dialog的可能,神奇的串台现象
排查:
既然打开dialog为上一次的,那么表明【浏览器加载了多个同id对象,导致浏览器解析加载错误】
那么,只要保证浏览器存在唯一的对象就能解决这个问题
解决方案:
1.新建一个变量,保存dialog对象,无论那个使用都操作该变量
结果:经实验,只要调用$('#id').dialog({...}); 就会构造一个新的dialog对象,开启关闭都要用,多次调用还是会产生多个对象
网上说该方案可行,我试了试,没啥效果,得大家试了,试好了,麻烦给我留言
2.打开dialog后,添加关闭事件,执行destroy方法,保证每次打开都是新的
结果:如果dialog绑定了页面的div,那么打开一次后,再也打不开了,猜想可能是连着这个div的dom对象一次玉石俱焚了。。。。惨!
可行的解决方案:
js追加dom元素,保证每次打开都追加一个dom对象让他去毁,以下是代码
应该也可以不声明,直接写,在里边添加关闭销毁事件
//注意:我用的时候是先声明了该变量,指定固定属性
var dataFile_Dg = $('<div></div>').dialog({
title: '文本文件上报监控详情',
1000,
height: 600,
closed: true,
cache: false,
modal: true,
onClose: function () {
$(this).dialog('destroy',true);
}
});
//在使用该变量的时候,要把固定属性重写一遍,否则打开一次小一次,最后就留个按钮了,请慎重!!!
//详情页
function forwardToDataFileMonitor(bankId) {
// alert("详情");
dataFile_Dg.dialog({
title: '文本文件上报监控详情',
1000,
height: 600,
closed: true,
cache: false,
modal: true,
href: 'report/static/html/dataFileMonitor/dataFileMonitor.html',
queryParams:{
Authorization: localStorage.token,
bankId: bankId,
reportDate: $('#reportDate').datebox('getValue')
},
});
dataFile_Dg.dialog('open');
}
补充建议:对话框加id
$('<div></div>').dialog({
id: 'uniqId', //插入该id,作为方法内变量,访问加该id即可
title: '文本文件上报监控详情',
1000,
height: 600,
closed: true,
cache: false,
modal: true,
href: 'report/static/html/dataFileMonitor/dataFileMonitor.html',
queryParams:{
Authorization: localStorage.token,
bankId: bankId,
reportDate: $('#reportDate').datebox('getValue')
},
});
$("#uniqId").dialog('open');