IE浏览器内容加载完毕,但进度条加载很慢IE进度条一直loading总处于未完成状态的问题...

xiaoxiao2021-03-01  11

项目中,有一个页面出现了如下的状况:

页面体会:

IE浏览器内容加载完毕,但进度条加载很慢/IE进度条一直loading总处于未完成状态

并且,“栏目树”按钮点击后需较长时间的停顿后才显示树状结构(IE6/IE7停顿明显,FireFox速度正常)

代码排查:

通过对弹出窗体——“栏目树”窗体代码的检查,发现:

“栏目树”窗体中含有2个iframe,其中有一个作为树状结构的容器(src 属性从servlet获取树形结构数据),另外一个暂时未用。

问题解决:

注释掉暂时无用的iframe——页面仅仅保留树状结构所在iframe。

修改后的效果:

树形结构显示流畅。

百度了下,有如下几篇文章不错,copy下来,以备温故知新。

关于IE进度条的问题

url:http://topic.csdn.net/t/20051031/17/4362120.html

问题:

现在遇到一个头痛的问题,一个jsp页面,当打开它时,也正常现实,一切都正常,只是下面的IE进度条每当打开这个页面时就一直处于未结束状态,而实际上页面的内容早已经显示完毕了,请问有哪几种可能会导致进度条始终处于读取状态呢

问题分析、解决:

找到原因了!!原因太隐蔽了,就是当有上下两个frame,上frame刷新下frame时,必须上frame也必须强制刷新一下,即使上frame没有任何变化,不然的话进度条就一直在等

===================================================================

页面包含iframe后,浏览器进度条一直loading

url:http://www.khgl.cn/html/02/n-541702.html

问题陈述:

我页面里面有个iframe,页面加载进来后, 这个iframe的内容也出来了

问题解决:

应该是iframe的原因 我把iframe这句删去 就没事了 而且页面里也没其他东西了

我页面里面有个table <table width= "100% " border= "0 " cellpadding= "1 " cellspacing= "0 "> <tr> <td valign= "top " class=bg1> <iframe name= "frame " border=0 frameborder=0 framespacing=0 width=100% height=326 marginheight=0 marginwidth=0 noResize scrolling=auto src= http://topic.csdn.net/u/20070405/16/"sysmyyh.do?method=LoadForSysYhQx " vspale= "0 " allowTransparency= "true "> </iframe> </td> </tr> </table> 我把其他的东西都删了还是有这个问题 但我把iframe标签删了后,就好了 我相信是iframe本身的问题 那是相当多列 js部分 <mce:script language= "javascript "><!-- var second; var three; //三级checkbox点击事件 function selectAll(value, index){ var check = document.all.check; var flag = true; for (var i = 0; i < check.length; i++){ if (check[i].second == value){ if (check[i].checked == false){ flag = false; second = check[i].second; three = check[i].three; } else{ second = value; three = index; } } } //二级checkbox if (flag){ for (var i = 0; i < check.length; i++){ if (check[i].first == second){ check[i].checked = true; } } } else{ for (var i = 0; i < check.length; i++){ if (check[i].first == second){ check[i].checked = false; } } } //一级checkbox flag = true; for (var i = 0; i < check.length; i++){ if (check[i].second == three){ if (check[i].checked == false){ flag = false; } } } if (flag){ for (var i = 0; i < check.length; i++){ if (check[i].first == three){ check[i].checked = true; } } } else{ for (var i = 0; i < check.length; i++){ if (check[i].first == three){ check[i].checked = false; } } } } //二级功能组点击事件 function expanded(table,img){ var tr = document.getElementById(table).getElementsByTagName( "tr "); var objImg = document.getElementById(img); for (var i = 0; i < tr.length; i++){ if (tr[i].three != " " && tr[i].three != undefined){ var close = tr[i].style.display; if (close == "none "){ objImg.src = "${ctx }/image/tree/dot2_2.gif "; tr[i].style.display = " "; } else{ objImg.src = "${ctx }/image/tree/dot1_1.gif "; tr[i].style.display = "none "; } } } } //一级功能组点击事件 function expand(table,img){ var tr = document.getElementById(table).getElementsByTagName( "tr "); var objImg = document.getElementById(img); for (var i = 0; i < tr.length; i++){ if (tr[i].three == " "){ var close = tr[i].style.display; if (close == "none "){ objImg.src = "${ctx }/image/tree/dot2_2.gif "; tr[i].style.display = " "; } else{ objImg.src = "${ctx }/image/tree/dot1_1.gif "; tr[i].style.display = "none "; } } } } //一级checkbox点击事件 function checkExpanded(obj, checkbox, table, img){ var objBox = document.all.check; //change二级和三级checkbox for (var i = 0; i < objBox.length; i++){ if ((objBox[i].second == checkbox) || (objBox[i].three == checkbox)){ if (obj.checked){ objBox[i].checked = true; } else{ objBox[i].checked = false; } } } var arr = new Array(); var index = 0; if (obj.checked){ //展开其下的内容 var tr = document.getElementById(table).getElementsByTagName( "tr "); var objImg = document.getElementById(img); for (var i = 0; i < tr.length; i++){ if (tr[i].second == checkbox){ objImg.src = "${ctx }/image/tree/dot2_2.gif "; tr[i].style.display = " "; arr[index] = tr[i].first; index++; } if (tr[i].three == checkbox){ objImg.src = "${ctx }/image/tree/dot2_2.gif "; tr[i].style.display = " "; } } for (var j = 0; j < arr.length; j++){ for (var i = 0; i < objBox.length; i++){ if (objBox[i].first == arr[j]){ document.getElementById(objBox[i].imgindex).src = "${ctx }/image/tree/dot2_2.gif "; } } } } } var father; //二级checkbox点击事件 function checkExpand(obj, checkbox, index, table, img){ var objBox = document.all.check; for (var i = 0; i < objBox.length; i++){ if (objBox[i].second == checkbox){ if (obj.checked){ objBox[i].checked = true; } else{ objBox[i].checked = false; } } } var check = document.all.check; var flag = true; for (var i = 0; i < check.length; i++){ if (check[i].second== index){ if (check[i].checked == false){ flag = false; father = check[i].second; } else{ father = index; } } } if (flag){ for (var i = 0; i < check.length; i++){ if (check[i].first == father){ check[i].checked = true; } } } else{ for (var i = 0; i < check.length; i++){ if (check[i].first == father){ check[i].checked = false; } } } if (obj.checked){ //展开其下的内容 var tr = document.getElementById(table).getElementsByTagName( "tr "); var objImg = document.getElementById(img); for (var i = 0; i < tr.length; i++){ if (tr[i].second == checkbox){ objImg.src = "${ctx }/image/tree/dot2_2.gif "; tr[i].style.display = " "; } } } } // --></mce:script> ---------回复-------------- html部分 <body leftmargin= "0 " topmargin= "0 " marginwidth= "0 " marginheight= "0 "> <table width= "100% " border= "0 " cellpadding= "6 " cellspacing= "0 " class=bg1> <tr> <td> <c:forEach var= "qxfirst " items= "${qxlist } " varStatus= "s "> <c:if test= "${ qxfirst.kind == 't ' } "> <table width= "100% " border= "0 " cellpadding= "1 " cellspacing= "0 "> <tr> <td> <table width= "100% " border= "0 " cellpadding= "0 " cellspacing= "0 " id= "table${s.index } "> <tr> <td> <table width= "100% " border= "0 " cellpadding= "0 " cellspacing= "0 "> <tr> <td width= "11 " align= "right "> <img id= "img${s.index} " src= http://topic.csdn.net/u/20070405/16/"../image/tree/dot1_1.gif " width= "9 " height= "9 " onClick= "expand( 'table${s.index} ', 'img${s.index} ') "> </td> <td> <input name= "check " type= "checkbox " id= "first " first= "check${s.index } " second= " " three= " " onClick= "checkExpanded(this, 'check${s.index} ', 'table${s.index } ', 'img${s.index } ') " value= "${qxfirst.value } "> <span class= "STYLE1 "> ${qxfirst.name } </span> </td> </tr> </table> </td> </tr> <c:forEach var= "qxsecond " items= "${qxlist } " varStatus= "t "> <c:choose> <c:when test= "${qxsecond.parent == qxfirst.value } "> <tr first= "check${t.index } " second= "check${s.index } " three= " " style= "display:none "> <td> <table width= "100% " border= "0 " cellpadding= "0 " id= "table${t.index } " cellspacing= "0 "> <tr align= "left "> <td align=right> <img src= http://topic.csdn.net/u/20070405/16/"../image/tree/xx002_1.gif " width= "12 " height= "17 "> </td> <td align= "left "> <table width= "100% " border= "0 " cellpadding= "0 " cellspacing= "0 "> <tr> <td width= "11 " align= "right "> <img id= "img${t.index} " src= http://topic.csdn.net/u/20070405/16/"../image/tree/dot1_1.gif " width= "9 " height= "9 " onClick= "expanded( 'table${t.index} ', 'img${t.index} ') "> </td> <td width= "7 "> <img src= http://topic.csdn.net/u/20070405/16/'../image/three/xx004_1.gif_1.gif " ' width= "7 " height= "1 "> </td> <td> <input name= "check " id= "second " first= "check${t.index } " second= "check${s.index } " three= " " type= "checkbox " imgindex= "img${t.index } " onClick= "checkExpand(this, 'check${t.index} ', 'check${s.index } ', 'table${t.index } ', 'img${t.index } ') " value= "${qxsecond.value } "> <span> ${qxsecond.name } </span> </td> </tr> </table> </td> </tr> <c:forEach var= "qxthree " items= "${qxlist } " varStatus= "m "> <c:choose> <c:when test= "${qxthree.parent == qxsecond.value} "> <tr first= "check${m.index } " second= "check${t.index } " three= "check${s.index } " style= "display:none "> <td colspan= "2 "> <table width= "80% " border= "0 " cellspacing= "0 " cellpadding= "0 " align= "right "> <tr> <td width= "18 " align= "right "> <img src= http://topic.csdn.net/u/20070405/16/"../image/tree/xx002_1.gif " width= "12 " height= "17 "> </td> <td align= "left "> <table width= "100% " border= "0 " cellpadding= "0 " cellspacing= "0 "> <tr> <td width= "11 " align= "right "> <img src= http://topic.csdn.net/u/20070405/16/"../image/tree/dot2_2.gif " width= "9 " height= "9 "> </td> <td width= "7 "> <img src= http://topic.csdn.net/u/20070405/16/'../image/three/xx004_1.gif.gif " ' width= "7 " height= "1 "?> </td> <td> <input name= "check " second= "check${t.index } " first= "check${m.index } " three= "check${s.index } " type= "checkbox " value= "${qxthree.value } " οnclick= "selectAll( 'check${t.index } ', 'check${s.index } ') "> ${qxthree.name } </td> </tr> </table> </td> </tr> </table> </td> </tr> </c:when> </c:choose> </c:forEach> </table> </td> </tr> </c:when> </c:choose> </c:forEach> </table> </td> </tr> </table> </c:if> </c:forEach> </td> </tr> </table> </body> ---------回复-------------- 我iframe中显示的是个树 应该没有关系 ---------回复-------------- 晕了,帖这么多JSTL的代码,应该也不会是JSTL这部分的,要不你试试是不是你的浏览器的问题,换其他人试下,你的那个IFRAME外面看不出来, <table width= "100% " border= "0 " cellpadding= "1 " cellspacing= "0 "> <tr> <td valign= "top " class=bg1> <iframe name= "frame " border=0 frameborder=0 framespacing=0 width=100% height=326 marginheight=0 marginwidth=0 noResize scrolling=auto src= http://topic.csdn.net/u/20070405/16/"http://www.baidu.com " vspale= "0 " allowTransparency= "true "> </iframe> </td> </tr> </table>

---------回复--------------不是浏览器的问题 我试过 得说一下

我的index.jsp中包含两个iframe(a.do, b.do) 然后b.do后跳转到b.jsp, b.jsp中又包含一个iframe, 我上面所说的页面就是指b.jsp。 不知道这样两次套用是不是问题的原因 ---------回复--------------刚才在网上狂查 终于找到了是怎么回事 把结果帖出来, 大家看看

是因为我iframe页面中又套用了iframe 这种操作就相当于 2个frame数据的同时更新, 导致IE无法判断是否装载完成

我在b.jsp页面里加了句 setTimeout( "document.all.frame.src= http://topic.csdn.net/u/20070405/16/'system.do?method=LoadForSys ' ", 1); 就好了。

===================================================================

用iframe做Tab页的内存泄漏问题以及进度条问题,急急急...

http://group.gimoo.net/review/136180

在系统中自己用iframe做了个Tab页,到测试的时候才发现。javascript频繁的操作iframe的时候导致内存泄漏,还有就是在插入的iframe的src链接返回的页面中如果包括iframe或者jsp:include,则sp3系统的IE浏览器内容加载完毕,但进度条加载很慢

转载请注明原文地址: https://www.6miu.com/read-3649990.html

最新回复(0)