黑马程序员技术交流社区

标题: Ajax功能一段代码两个功能分别只能能在FF（还有chrome）和I... [打印本页]
作者: su27    时间: 2014-9-21 00:06
标题: Ajax功能一段代码两个功能分别只能能在FF（还有chrome）和I...
本帖最后由 su27 于 2014-9-21 00:13 编辑

学着学着就慢慢接触到了一些涉及到浏览器内核解析的问题，学习方向和查找资料上有些没有头绪
这些天再看视频（没分Java还是.net的还是php的只是选取自己需要的模块补充知识体系）再开韩顺平教Ajax的时候有一段代码是为初步理解xmlAjaxhttprequest工作流程准备的有如下一段代码：
  1. <script type="text/javascript">
  2.    
  3.    //创建Ajax引擎
  4.    function getXmlHttpObject(){
  5.       //不同浏览器获取xmlhttprequest对象的方法不一样
  6.       if(window.ActiveXObject){
  7.              xmlHttpRequest=new ActiveXObject("Microsoft.XMLHTTP");
  8.           }else{
  9.              xmlHttpRequest=new XMLHttpRequest();
  10.       }

  12.           return xmlHttpRequest;
  13.    }
  14.    
  15.    var myXmlHttpRequest="";
  16.    //验证用户名是否存在
  17.    function checkName(){
  18.            myXmlHttpRequest=getXmlHttpObject();

  20.        //怎么判断创建ok
  21.            if (myXmlHttpRequest){
  22.                
  23.                 //通过myXmlHttpRequest发送请求到服务器的某个页面
  24.                 //第一个参数表示请求方式：”get“、”post“
  25.                 //第二个蚕食指定URL对哪个页面发出Ajax请求（本质仍旧是HTTP请求）
  26.                 //第三个参数选择true表示异步机制false表示不使用异步机制
  27.                 var url="/ajax/registerProcess.php?username="+$("username").value;
  28.                
  29.         //打开请求
  30.                 myXmlHttpRequest.open("get",url,true);

  32.                 //指定回调函数（下边的处理是自定义函数名）
  33.                 myXmlHttpRequest.onreadystatechange=chuli;

  35.                 //真的发送请求如果是post有相应的内容需要填入参数位
  36.         myXmlHttpRequest.send(null);
  37.             }
  38.           }
  39.     //我们这里用函数获取网页中的用户名
  40.         function $(id){
  41.                 return document.getElementById(id);
  42.         }

  44.         //回调函数
  45.         function chuli(){
  46.                 //window.alert("处理函数被调用"+myXmlHttpRequest.readystate);//IE下可实现
  47.                 if (myXmlHttpRequest.readyState==4){
  48.                         //取出值，根据返回信息的格式定.txt
  49.                         window.alert("服务器返回"+myXmlHttpRequest.response);
  50.                 }//FF下可实现360（chrome）可实现
  51.                 else{window.alert("不是4");}
  52.         }
  53. </script>
复制代码

function chuli(){
//window.alert("处理函数被调用"+myXmlHttpRequest.readystate);//IE下可实现
if (myXmlHttpRequest.readyState==4){
//取出值，根据返回信息的格式定.txt
window.alert("服务器返回"+myXmlHttpRequest.response);
}//FF下可实现360（chrome）可实现
else{window.alert("不是4");}
}
上边两个功能分别在两种内核的浏览器中可以被正常使用让我以获得是在ie下蓝色代码可以执行，响应分别指出xmlHttpRequest的四个流程的流程号
但是在FF下该段代码只能响应三次，并且无法在alert中打印出响应的流程号（输出“处理函数被调用undefined”）

如果这一点我还能理解可能是浏览器解释方法的区别的话那么当实现零一段代码时出现的现象我无法理解
注释掉蓝色代码，打开绿色代码 z这一次FF浏览器和360浏览器（估计这里调用的chrome内核）却能正常实现代码，取得php文件中的结果并返回给浏览器
但是运行条件是浏览器取得了myXmlHttpRequest.readyState 这个流程编号才能走到下一步，这种情况该如何解释？是浏览器实际获取了流程号但是在第一个功能内没有输出，或是没有获取编号但是因为if没有其他分支所以默认走了这一条
刚刚实验了一下if后边加了个else{window.alert("不是4")；}在FF中运行结果出现了三次相应分别是“不是4”，“不是4”还有一个正确的结果
在ie中运行出现了三次“不是4”和正确结果
哪位前辈和同道中人懂的谢不吝赐教，更重要的是该怎么去找相应解释Ajax不同内核解释运行区别的资料




作者: yueyazhishang    时间: 2014-9-21 00:08
果然还有和我一样在撸代码的同仁。
作者: su27    时间: 2014-9-21 00:09
  1. <script type="text/javascript">
  2.    
  3.    //创建Ajax引擎
  4.    function getXmlHttpObject(){
  5.       //不同浏览器获取xmlhttprequest对象的方法不一样
  6.       if(window.ActiveXObject){
  7.              xmlHttpRequest=new ActiveXObject("Microsoft.XMLHTTP");
  8.           }else{
  9.              xmlHttpRequest=new XMLHttpRequest();
  10.       }

  12.           return xmlHttpRequest;
  13.    }
  14.    
  15.    var myXmlHttpRequest="";
  16.    //验证用户名是否存在
  17.    function checkName(){
  18.            myXmlHttpRequest=getXmlHttpObject();

  20.        //怎么判断创建ok
  21.            if (myXmlHttpRequest){
  22.                
  23.                 //通过myXmlHttpRequest发送请求到服务器的某个页面
  24.                 //第一个参数表示请求方式：”get“、”post“
  25.                 //第二个蚕食指定URL对哪个页面发出Ajax请求（本质仍旧是HTTP请求）
  26.                 //第三个参数选择true表示异步机制false表示不使用异步机制
  27.                 var url="/ajax/registerProcess.php?username="+$("username").value;
  28.                
  29.         //打开请求
  30.                 myXmlHttpRequest.open("get",url,true);

  32.                 //指定回调函数（下边的处理是自定义函数名）
  33.                 myXmlHttpRequest.onreadystatechange=chuli;

  35.                 //真的发送请求如果是post有相应的内容需要填入参数位
  36.         myXmlHttpRequest.send(null);
  37.             }
  38.           }
  39.     //我们这里用函数获取网页中的用户名
  40.         function $(id){
  41.                 return document.getElementById(id);
  42.         }

  44.         //回调函数
  45.         function chuli(){
  46.                 //window.alert("处理函数被调用"+myXmlHttpRequest.readystate);//IE下可实现
  47.                 if (myXmlHttpRequest.readyState==4){
  48.                         //取出值，根据返回信息的格式定.txt
  49.                         window.alert("服务器返回"+myXmlHttpRequest.response);
  50.                 }//FF下可实现360（chrome）可实现
  51.                 else{window.alert("不是4");}
  52.         }
  53. </script>
复制代码

还以为代码可以着色
作者: su27    时间: 2014-9-21 00:14
yueyazhishang 发表于 2014-9-21 00:08
果然还有和我一样在撸代码的同仁。

你好快啊，刷新了没，第一次的代码发的有问题
作者: su27    时间: 2014-9-21 11:04
这个一定有人游过相应问题，我又在想，是不是在不同浏览器中建立Ajax连接的时候，内容或是格式有所区别（就如同不同web服务器返回的http头遵循同样标准但是消息格式标准不一）



欢迎光临 黑马程序员技术交流社区 (http://bbs.itheima.com/) 黑马程序员IT技术论坛 X3.2