JQEasy-ui在IE9以下版本中二次加载的问题分析及处理方法教程
程序员文章站
2022-06-12 23:09:30
网上答案说是因为easy-ui在低版本时应将class样式删去，而在javascript里写url，因为class里有url的话javascript里也存在url，就会使页面刷新俩...
网上答案说是因为easy-ui在低版本时应将class样式删去，而在javascript里写url，因为class里有url的话javascript里也存在url，就会使页面刷新俩次，但是测试后没有解决我的问题，后来通过反复测试终于找到问题，
<ul id="eva" style=" font-size:25px; "> </ul>
因为在页面写了style,将style里的样式删去就可以解决问题了，现附上完整的ajax动态树和grid表格代码。
<html>
<head>
<title>tree</title>
<link href="../../content/jqeasyui/themes/default/easyui.css" rel="stylesheet" type="text/css" />
<link href="../../content/jqeasyui/themes/icon.css" rel="stylesheet" />
<script src="../../scripts/jquery-1.4.4.min.js" type="text/javascript"></script>
<script src="../../scripts/jquery.unobtrusive-ajax.js" type="text/javascript"></script>
<script src="../../scripts/jquery.easyui.min.js" type="text/javascript"></script>
<script src="../../scripts/easyui-lang-zh_cn.js" type="text/javascript"></script>
<script type="text/javascript">
var nodetext;
var time;
var treeeva;
$(function () {
inittable();
$("#selectform").css("display", "none");
bindsearcheclick();
$('#eva').tree({
url: '/oee/gettree',
method: 'get',
animate: true,
checkbox: true
});
});
//初始化表格
function inittable() {
$('#tt').datagrid({
url: '/oee/details',
title: 'oee',
width: 700,
height: 360,
fitcolumns: true,
idfield: 'fid',
loadmsg: '正在加载设备的信息...',
pagination: true,
singleselect: false,
pagesize: 10,
pagenumber: 1,
pagelist: [10, 20, 30],
queryparams: {//要传入的参数
noderesult: nodetext,
selecttime: $('#selecttime').datebox('getvalue')
},
columns: [[//{eid, etypename, thentypeinfotid, etypenum}
{field: 'num', title: '设备编号', width: 80, align: "center" },
{ field: 'name', title: '设备名称', width: 80, align: "center" },
{ field: 'earlytimeoee', title: '早班oee', width: 80, align: "center" },
{ field: 'middletimeoee', title: '午班oee', width: 80, align: "center" },
{ field: 'latertimeoee', title: '晚班oee', width: 80, align: "center" },
{
field: 'delflag', title: '操作', width: 80, align: 'center',
formatter: function (value, row, index) {
var str = "<a fid='" + row.fid + "' class='selectinfo' href='javascript：void(0)'>明细</a> ";
return str;
}
}
]],
onheadercontextmenu: function (e, field) {
},
onloadsuccess: function (data) {
$(".selectinfo").unbind("click");
$(".selectinfo").bind("click", function () {
doselect($(this).attr("fid"), time);
return false;
});
}
});
}
function doselect(fid, time) {
var reg = new regexp("-", "g");
var strobj = fid.tostring();
var newstr = strobj.replace(reg, "$");
$('#selectframe').attr('src', '/oee/getselectinfo/' + fid + '/' + time);
$('#selectform').css('display', 'block');
$('#selectform').dialog({
width: 470,
height: 470,
modal: true,
title: "显示明细信息",
collapsible: true,
minimizable: true,
maximizable: true,
resizable: true,
buttons: [{
id: 'btnselect',
text: '确定',
iconcls: 'icon-add',
handler: function () {
$("#selectform").dialog("close");
}
}]
});
}
//绑定搜索查询的 点击事件
function bindsearcheclick() {
//linkbuttonsearch
$("#linkbuttonsearch").click(function () {
var nodes = $('#eva').tree('getchecked');
var s = '';
for (var i = 0; i < nodes.length; i++) {
if (s != '') s += ',';
s += nodes[i].id;
}
nodetext = s;
time = $('#selecttime').datebox('getvalue');
inittable();
});
}
</script>
</head>
<body>
<p style="width: 1000px">
<p style="width: 200px; float: left">
<p style="margin: 23px 0;">
</p>
<p class="easyui-panel" style="padding: 5px; border-radius: 5px;">
<ul id="eva" >
</ul>
</p>
</p>
<p id="right">
<p id="query">
查询时间：<input class="easyui-datebox" name="selecttime" id="selecttime" />
<a id="linkbuttonsearch" href="javascript：void(0)" class="easyui-linkbutton" data-options="iconcls:'icon-search'">
查询</a>
</p>
<table id="tt" style="width: 700px;" title="标题" iconcls="icon-edit">
</table>
<p id="selectform">
<iframe id="selectframe" src="javascript：void(0)" frameborder="0" width="100%" height="100%">
</iframe>
</p>
</p>
</p>
</body>
</html>