ITPUB??ì3
报名申请微软有影响力专家
ITPUB论坛 » WEB 2.0技术 » 关于使用ajax 自动刷新的一点疑问?

新一届的微软MVP评选已经开始,欢迎各位推荐!

标题: [笔记] 关于使用ajax 自动刷新的一点疑问?
离线 demo_3312
一般会员



精华贴数 0
个人空间 0
技术积分 308 (6668)
社区积分 0 (1597406)
注册日期 2007-10-12
论坛徽章:1
ITPUB新首页上线纪念徽章     
      

发表于 2007-12-19 15:04 
关于使用ajax 自动刷新的一点疑问?

jsp:
<html:html   lang="true">
  <head>
        <html:base   />
        <title> Ajax.jsp </title>
        <script   type="text/javascript">
          var   xmlHttp;

          function   createXMLHttpRequest()   {
                if   (window.ActiveXObject)   {
                        xmlHttp   =   new   ActiveXObject("Microsoft.XMLHTTP");
                     }   
                else   if   (window.XMLHttpRequest)   {
                    xmlHttp   =   new   XMLHttpRequest();
                     }
               }
        
       function   startRequest()   {
               createXMLHttpRequest();
               var   url   =   " <%=request.getContextPath()%> /ajax.do?method=showTable";
               xmlHttp.onreadystatechange   =   handleStateChange;
               xmlHttp.open("POST",   url,   true);
               xmlHttp.send(null);
        }
        
       function   handleStateChange()   {
          if(xmlHttp.readyState   ==   4)   {
              if(xmlHttp.status   ==   200)   {
              showTable();
              setInterval("startRequest();",2000);
                  }
         }
   }

     function   showTable(){
          var   xmlDoc=xmlHttp.responseXML;
          var   students=xmlDoc.getElementsByTagName("student");   
          var   result=" <table   border=1> <tr> <th> ID </th> <th> USERNAME </th> <th> PASSWORD </th> </tr    > ";     
          for(var   i=0;i <students.length;i++){
                   result   +=" <tr> ";
                    var   student=students;
                     result   
                          +=" <td> "+student.getElementsByTagName("id")[0].firstChild.nodeValue+" </td> ";
                     result   
                           +=" <td> "+student.getElementsByTagName("username")[0].firstChild.nodeValue+" </td> ";
                     result   
                            +=" <td> "+student.getElementsByTagName("password")[0].firstChild.nodeValue+" </td> ";
                     result   +=" </tr> ";
             }
                      result   +=" </table> ";
                      document.getElementById('result').innerHTML=result; }
</script>
     </head>
   
    <body>
        <html:form   action="employee"   method="post"   focus="login">
            <input   type="button"   value="Click"   onClick="startRequest();"   />   
            <div   id="result"> </div>
        </html:form>
    </body>
</html:html>





ajax.do:
      private   static   final   Logger   log=Logger.getLogger(AjaxAction.class);
public   ActionForward   showTable(ActionMapping   mapping,   ActionForm   form,
HttpServletRequest   request,   HttpServletResponse   response)   {
        try{
  System.out.println("end");
  UserInfoBO   bo=new   UserInfoBO();
  List   list=bo.init();
  response.setContentType("text/xml");
  PrintWriter   out=response.getWriter();
  out.print(parasToXml(list));
        }catch(Exception   e){
  log.error("显示表格错误"+e);
        }
        return   null;
}

public   String   parasToXml(List   list){
StringBuffer   sb=new   StringBuffer();
sb.append(" <?xml   version=\"1.0\"   encoding=\"GBK\"   ?> ");
sb.append(" <sutdents> ");
for(int   i=0;i <list.size();i++){
  UserInfo   info=(UserInfo)list.get(i);
          sb.append(" <student> ");
          sb.append(" <id> "+info.getId()+" </id> ");
          sb.append(" <username> "+info.getUsername()+" </username> ");
          sb.append(" <password> "+info.getPassword()+" </password> ");
          sb.append(" </student> ");
}
sb.append(" </sutdents> ");

return   sb.toString();
}


在showTable方法里面有一行System.out.println("end");
运行的时候在控制台上输出end的次数依次为1,1,2,4,6,10。。。
这里我就不是很明白,应该每次输出end的次数为2次,
第一次执行showTable时输出,第二次是执行 setInterval("startRequest();",2000);输出的

大概运行了20分站把,也没有报错,控制台也没有输出"end",相当与挺了
请问为什么会这样?


只看该作者    顶部
离线 iooyoo
迷眼流金


精华贴数 0
个人空间 20
技术积分 4437 (328)
社区积分 3676 (397)
注册日期 2006-6-15
论坛徽章:27
现任管理团队成员2008北京奥运纪念徽章:排球2008北京奥运纪念徽章:乒乓球生肖徽章2007版:蛇2008北京奥运纪念徽章:跳水2008北京奥运纪念徽章:羽毛球
2008北京奥运纪念徽章:皮划艇激流回旋2008北京奥运纪念徽章:举重2008新春纪念徽章   

发表于 2007-12-20 16:10 
有调试的记录吗?后台的进入是否正确?再次刷新时有没有对上次操作(未完成的)做处理?
“运行的时候在控制台上输出end的次数依次为1,1,2,4,6,10。。。
这里我就不是很明白,应该每次输出end的次数为2次, ” 是什么意思?


__________________

使君欲醉离亭酒
酒醒离愁转有
紫禁多时虚右
苕霄留难久
一声歌掩双罗袖
日落乱山春后
犹有东城烟柳
青荫长依旧
只看该作者    顶部
离线 demo_3312
一般会员



精华贴数 0
个人空间 0
技术积分 308 (6668)
社区积分 0 (1597406)
注册日期 2007-10-12
论坛徽章:1
ITPUB新首页上线纪念徽章     
      

发表于 2007-12-21 09:12 
调试的记录:  没有
后台的进入是否正确:  正确,不然的话是不会输出"end"
再次刷新时有没有对上次操作(未完成的)做处理:  没有

我认为它应该在控制台输出是2次“end”的原因是
if(xmlHttp.status == 200) {
     showTable();
     setInterval("startRequest();",2000);
}
执行到showTable的时候,它会到url里面执行也就会输出"end"
然后执行setInterval("startRequest();",2000);这个时候它就应该又执行一次showTable,
就会在次输出"end",那么就应该是每次输出2个"end"

但是实际上,在执行showTable的时候,在控制台上就输出了一次end,
然后setInterval("startRequest();",2000);它并不会马上去执行startRequest()方法,而是2秒后在去
去执行,所以每次会输出一次"end",当然是在把setInterval改成setTimeout后,才可以实现的


只看该作者    顶部
离线 iooyoo
迷眼流金


精华贴数 0
个人空间 20
技术积分 4437 (328)
社区积分 3676 (397)
注册日期 2006-6-15
论坛徽章:27
现任管理团队成员2008北京奥运纪念徽章:排球2008北京奥运纪念徽章:乒乓球生肖徽章2007版:蛇2008北京奥运纪念徽章:跳水2008北京奥运纪念徽章:羽毛球
2008北京奥运纪念徽章:皮划艇激流回旋2008北京奥运纪念徽章:举重2008新春纪念徽章   

发表于 2007-12-21 11:00 
然后执行setInterval("startRequest();",2000);这个时候它就应该又执行一次showTable

  <script>

  setInterval("alert('aa');",2000);
  </script>
试试,看看效果

setInterval是每隔一段事件执行一次语句,你这里第一次ajax返回后每隔2秒刷一次,每次刷新前台后再加一个setInterval  越来越多,越来越多……

这样对服务器的压力是很大的

你这种登录后定时刷新的最好把完成的过程理清楚先
进入页面,用户提交登录请求,局部刷新登录信息,开始定时刷新,页面退出时清空interval
判断interval是否异启动,判断刷新是否以完成,这些过程理顺先


__________________

使君欲醉离亭酒
酒醒离愁转有
紫禁多时虚右
苕霄留难久
一声歌掩双罗袖
日落乱山春后
犹有东城烟柳
青荫长依旧
只看该作者    顶部
离线 demo_3312
一般会员



精华贴数 0
个人空间 0
技术积分 308 (6668)
社区积分 0 (1597406)
注册日期 2007-10-12
论坛徽章:1
ITPUB新首页上线纪念徽章     
      

发表于 2007-12-21 16:00 
setInterval是每隔一段事件执行一次语句,你这里第一次ajax返回后每隔2秒刷一次,每次刷新前台后再加一个setInterval  越来越多,越来越多……

setInterval("startRequest();",2000);可不可以这样理解:
每2秒刷新一次,那么10秒钟就刷新了5次startRequest()方法,要是这样的话,就应该没什么问题
但是你说,每次刷新前台后再加一个setInterval,这是什么意思?有点不明白,难道是循环执行?


只看该作者    顶部
离线 iooyoo
迷眼流金


精华贴数 0
个人空间 20
技术积分 4437 (328)
社区积分 3676 (397)
注册日期 2006-6-15
论坛徽章:27
现任管理团队成员2008北京奥运纪念徽章:排球2008北京奥运纪念徽章:乒乓球生肖徽章2007版:蛇2008北京奥运纪念徽章:跳水2008北京奥运纪念徽章:羽毛球
2008北京奥运纪念徽章:皮划艇激流回旋2008北京奥运纪念徽章:举重2008新春纪念徽章   

发表于 2007-12-21 16:07 
……
1 setInterva中要执行的语句是先等待、再执行,而不是执行语句
while(true) {
  wait(timesegment);
  excute()
}

而不是
while(true) {
  excute();
  wait(timesegment);
}

这个自己试一下应该能看出来


2 你自己看不出来吗?你每次startRequest后都会回调handleStateChange,每次handleStateChange都注册了一个setInterval,也就是说,你本来想每2秒调一次startRequest,现在是每2秒调一次setInterval??


__________________

使君欲醉离亭酒
酒醒离愁转有
紫禁多时虚右
苕霄留难久
一声歌掩双罗袖
日落乱山春后
犹有东城烟柳
青荫长依旧
只看该作者    顶部
离线 demo_3312
一般会员



精华贴数 0
个人空间 0
技术积分 308 (6668)
社区积分 0 (1597406)
注册日期 2007-10-12
论坛徽章:1
ITPUB新首页上线纪念徽章     
      

发表于 2007-12-24 08:48 
原来是这样啊,谢谢你啦!


只看该作者    顶部
 
    

相关内容


CopyRight 1999-2006 itpub.net All Right Reserved.
北京皓辰网域网络信息技术有限公司. 版权所有
E-mail:Webmaster@itpub.net
京ICP证:060528号 联系我们 法律顾问