zoukankan      html  css  js  c++  java
  • Ajax浏览器支持(二)

    1.不同的浏览器创建 XMLHttpRequest 对象的方法是有差异的。

    IE 浏览器使用 ActiveXObject,而其他的浏览器使用名为 XMLHttpRequest JavaScript 内建对象。

    <script type="text/javascript">

    function ajaxFunction()

     {

     var xmlHttp;

      try

        {

       // Firefox, Opera 8.0+, Safari

        xmlHttp=new XMLHttpRequest();

        }

     catch (e)

        {

         // Internet Explorer

         try

            {

            xmlHttp=new ActiveXObject("Msxml2.XMLHTTP");//IE 6.0+

            }

            catch (e)

            {

               try

                    {

                      xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");//IE 5.5+

                    }

                catch (e)

                      {

                      alert("您的浏览器不支持AJAX");

                    return false;

                      }

               }

        }

     }

    </script>

    2. onreadystatechange也需要不同浏览器的支持

    它并不按常规的语法(在onreadystatechange事件中)来实现同步,而在在调用完send方法后,就可以直接用xmlHttpRequest.responseText获取数据。
    ajaxXMLHttpRequest.onreadystatechange方法的差异:
    Firefox中当状态为1(即XMLHttpRequest已经调用open但还没有调用send时),Firefox则会继续执行onreadystatechange后面的代码,到执行完后面的代码后,在执行onreadystatechange在状态234的代码,而IE会等待状态2的到了,执行完onreadystatechange中状态234的代码后,继续执行后面的代码,这样问题就出现了,经常我们在onreadystatechange的代码要处理从服务器上获得的数据(这个数据只有在onreadystatechange的状态为4时,才可以得到),所以这在IE中不存在问题,因为它会等待onreadystatechange状态4到来以后,在执行onreadystatechange后面的数据,但是由于Firefox不会等到onreadystatechange状态4到来后在执行onreadystatechange后面的代码,所以后面的代码就不能处理从服务器上获得的数据。

    <html>

    <head>

    <script type="text/javascript">

         var xmlHttp=ajaxBtnClick();

         var id;

          function btnDel(delID)

          {      

            if(xmlHttp==null)

            {

               return false;

            }

            id=delID;

            var date=new Date();       

            xmlHttp.open("GET","AjaxDel.ashx?id="+id+"&time="+date.getSeconds(),false);//time是为了防止请求页返回缓存的值      

            //如果为firefox则调用delMsg(),如果不为firefox则调用delMsg

            xmlHttp.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");

            xmlHttp.onreadystatechange=navigator.userAgent.indexOf("Firefox")>0?delMsg():delMsg;

            xmlHttp.send();

            //如果是Firefox则只有在执行完成后才能获取Ajax的值,所以需要在这里在此调用一次

            xmlHttp.onreadystatechange=navigator.userAgent.indexOf("Firefox")>0?delMsg():delMsg;    

          }

          function delMsg()

            {

             var td=document.getElementById(id);

             var tb=document.getElementById("tbStu");

             var i=td.parentNode.parentNode.rowIndex;//获取当前的trtable里面的索引号,从0开始算

               if(xmlHttp.readyState==4)

               {                    

                 if(xmlHttp.responseText=="True")

                 {

                    alert("删除成功");               

                     tb.deleteRow(i);//删除tb里面指定的Row                

                 }        

               }

            }

        </script>

    </head>

    <body>
        <form id="form1" runat="server">
        <div>
       
        <asp:ListView ID="ListView1" runat="server">
        <LayoutTemplate>
          <table id="tbStu">
            <tr id="itemPlaceholder" runat="server" />
          </table>        
        </LayoutTemplate>
        <ItemTemplate>
            <tr>
             <td><%#Eval("ID") %></td>
              <td>
               <%#Eval("name") %>
            </td>
            <td>
               <%#Eval("pwd") %>
            </td>
            <td><%#Eval("sex") %></td>
            <td>
              <input id='<%#Eval("ID") %>' type="button" onclick='btnDel("<%#Eval("ID") %>")' value="Ajax删除"/>
            </td>
            </tr>
        </ItemTemplate>
        </asp:ListView>
        </div>
        </form>
    </body>

    </html>

     

    AjaxDel.ashx页面

     public void ProcessRequest (HttpContext context) {
            context.Response.ContentType = "text/plain";
            string id=context.Request.Params["id"];
            bool b=StudentData.DelStu(id);//这个是直接写的一个函数,根据id来删除数据
            context.Response.Write(b);
        }

     

    3.判断是什么浏览器

    function getOs()      
        {      
           var OsObject = "";      
           if(navigator.userAgent.indexOf("MSIE")>0) {      
                return "MSIE";       //IE
    浏览器  
           }  
           if(isFirefox=navigator.userAgent.indexOf("Firefox")>0){      
                return "Firefox";     //Firefox
    浏览器  
           }  
           if(isSafari=navigator.userAgent.indexOf("Safari")>0) {      
                return "Safari";      //Safan
    浏览器  
           }  
           if(isCamino=navigator.userAgent.indexOf("Camino")>0){      
                return "Camino";   //Camino
    浏览器  
           }  
           if(isMozilla=navigator.userAgent.indexOf("Gecko/")>0){      
                return "Gecko";    //Gecko
    浏览器  
           }      
        }    

    其实在实际也没必要这样判断,因为不同浏览器之间只是他们的内核不同而已,而现在主要的有两种内核,一种是IE内核,另一种是Firefox内核;比如:SafanCamino他们的内核和Firefox内核是一样的;360浏览器就是基于IE内核的。所以在判断是只要判断是否是ie就行了,其他都做一样的处理。

  • 相关阅读:
    Java 课程设计:LWZ
    回溯法解骑士巡游问题
    2021.3.30 错误2
    2021.3.29 关于上下滚动
    2021.3.28 WebView的用法
    2021.3.27 关于错误1
    2021.3.26 Python创建表
    2021.3.25 人月神话阅读笔记06
    2021.3.24 个人作业第三阶段1
    2021.3.23 个人作业第三阶段
  • 原文地址:https://www.cnblogs.com/wenwei/p/Ajax.html
Copyright © 2011-2022 走看看