发布于 2016-08-27 22:57:52 | 126 次阅读 | 评论: 1 | 来源: 网友投递

这里有新鲜出炉的jQuery示例,程序狗速度看过来!

jQuery javascript框架

jQuery是一个兼容多浏览器的javascript框架,核心理念是write less,do more(写得更少,做得更多)。jQuery在2006年1月由美国人John Resig在纽约的barcamp发布,吸引了来自世界各地的众多JavaScript高手加入,由Dave Methvin率领团队进行开发。


今天在做系统测试的时候,原本用Jquery写了一个动态加载的树形菜单,发现在IE7下无法加载数据,(采用的是jquery1.3.2版本的$.ajax方法),上网查询到原来是IE7的执行ajax是用XMLHTTPRequest来声明的,经过对比果然如此;后采用以下的方法随即解决了问题。
通过查看源码发现
 
// Create the request object; Microsoft failed to properly 
// implement the XMLHttpRequest in IE7, so we use the ActiveXObject when it is available 
// This function can be overriden by calling jQuery.ajaxSetup 
xhr:function(){ 
return window.ActiveXObject ? new ActiveXObject("Microsoft.XMLHTTP") : new XMLHttpRequest(); 
}, 

以下是这个jquery的源码的版本声明
 
/* 
* jQuery JavaScript Library v1.3.2 
* http://jquery.com/ 
* 
* Copyright (c) 2009 John Resig 
* Dual licensed under the MIT and GPL licenses. 
* http://docs.jquery.com/License 
* 
* Date: 2009-02-19 17:34:21 -0500 (Thu, 19 Feb 2009) 
* Revision: 6246 
*/ 

通过一个html打印“window.ActiveXObject ”的结果可以知道IE6、IE7和IE8都是返回的true,
测试的html源码为(同一个目录下有一个名为index.jsp页面,内容无所谓。)
 
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> 
<html> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> 
<title>Insert title here</title> 
<script type="text/javascript" src="javascript/jquery.js"></script> 
<script type="text/javascript"> 
$(function (){ 
$.ajax({ 
url:"index.jsp", 
success:function(){alert("success")}, 
error:function(){alert("error")} 
}); 
//$("div").append("<font color='red'>window.ActiveXObject:</font>"); 
//$("div").append((window.ActiveXObject?"true":"false")); 
//alert(typeof(new XMLHttpRequest())); 
//alert(typeof(new ActiveXObject("Msxml2.XMLHTTP.4.0"))); 
//alert(typeof(new ActiveXObject("Msxml2.XMLHTTP"))); 
//alert(typeof(new ActiveXObject("Microsoft.XMLHTTP"))); 
}); 
</script> 
</head> 
<body> 
<div></div> 
</body> 
</html> 

情况一:
不修改源码,则IE6中可以弹出“success”的提示,而IE7却没有任何提示,连错误提示都没有。
情况二:
将源码中的
window.ActiveXObject ? new ActiveXObject("Microsoft.XMLHTTP") : new XMLHttpRequest();
修改为
window.ActiveXObject ? new XMLHttpRequest() : new XMLHttpRequest();
则IE7中是弹出“success”的提示,而IE6却提示js错误,详情大概为”XMLHttpRequest对象未定义“
两种情况下FireFox都可以正常提示“success”,版本是FireFox3.5.3,其他浏览器不知道。
由此可见IE7中需要使用new XMLHttpRequest()初始化ajax对象,IE6则使用new ActiveXObject("Microsoft.XMLHTTP")
但是jQuery源码中却没有对IE7的初始化方法进行兼容,而官网上的兼容说明是IE6+。
难道是我理解错误,还是其他的什么?希望大家给点意见,jQuery很好用,但是我不能要求客户必须用IE6,而放弃IE7啊!
最后多一句:
prototype最新版1.6.1也是同样的问题IE7下的Ajax.Request是没有作用的,需要将源码的1130行左右的
 
var Ajax = { 
getTransport: function() { 
return Try.these( 
function() {return new XMLHttpRequest()}, 
function() {return new ActiveXObject('Msxml2.XMLHTTP')}, 
//function() {return new ActiveXObject('Msxml2.XMLHTTP.4.0')}, 
function() {return new ActiveXObject('Microsoft.XMLHTTP')} 
) || false; 
}, 

进行修改,注释的那个部分是需要添加的修改。
这样才可以在IE7下使用这个ajax请求方法。
可是大家粗略的看一下,这里面的ajax初始化是先使用new XMLHttpRequest()创建,那就是说,
如果我不修改的话IE7应该也是可以的。
注:最后这个多一句的IE7兼容办法是在网络上搜索到的
以上就是我今天研究的结果,弄的我很糊涂,到底这个IE6、IE7和IE8全面兼容的jQuery的到底怎么实现(不能影响FireFox等等哦)
如果结论是:
由此可见IE7中需要使用new XMLHttpRequest()初始化ajax对象,IE6则使用new ActiveXObject("Microsoft.XMLHTTP")
那么prototype中的又怎么解释?
我已经糊涂了,希望大家指点一二!
刚才又搜索了一下关于XMLHttpRequest的创建方法,最后将源码修改为
return window.XMLHttpRequest? new XMLHttpRequest() : window.ActiveXObject ? new ActiveXObject("Microsoft.XMLHTTP") : new XMLHttpRequest();
则IE6\7\8和FF都可以运行了。
总算是解决了。

最新网友评论  共有(1)条评论 发布评论 返回顶部
zsqqaq 发布于2016-09-27 06:40:37
支持(0)  反对(0)  回复

Copyright © 2007-2017 PHPERZ.COM All Rights Reserved   冀ICP备14009818号  版权声明  广告服务