prototype.js 和json.js 冲突
2013-11-13 11:01
253 查看
1.冲突简述和分析
prototype.js与json.js并不是完全兼容的。主要冲突在于json.js为Object的原型增加了一个toJSONString的方法。
冲突之一:是prototype中发送ajax请求时,遍历了一个header Object,结果将toJSONString也误当作一个header属性发送,导致错误:
[Exception... "Component returned failure code: 0x80070057 (NS_ERROR_ILLEGAL_VALUE) [nsIXMLHttpRequest.setRequestHeader]" nsresult: "0x80070057 (NS_ERROR_ILLEGAL_VALUE)" location: "JS frame :: http://astlogo.com/cstmface/js/lib/prototype.js :: anonymous ::
line 1289" data: no]
如果您没有将ajax请求异常捕获,遇到这个冲突的时候会很诡异。即没有js错误提示,也没有发送请求。如果遇到这样的情况,请在Ajax.Request请求的选项中多加一个事件监听:
function x_load_testdata(id) {
new Ajax.Request('testdata.php',
{
method:'get',
onSuccess: function(transport){
},
onFailure: function(){ alert('Request failure') },
onException: function(x, e) { alert(e) }
});
}
确认一下是否因为这个冲突导致。
冲突之二:反过来,如果将prototype使用的所有Object都增加一个toJSONString方法,也会出现问题。由于prototype的继承关系比较复杂,有些对象因此会继承多个toJSONString方法,调用的时候就会出错。
2.解决冲突的方案
首先,请先加载prototype.js,后加载json.js,这样就可以避免出现“冲突之二”。
<script type="text/javascript" src="js/lib/prototype.js"></script>
<script type="text/javascript" src="js/lib/json.js"></script>
其次,要解决prototype的Ajax.Request异常,就需要修改prototype.js的代码了(就我自己来说很不想改,不过如果您的项目也是必须同时依赖这两个JS,请也按照下面步骤修改):
在prototype.js中找到:(大概位于第1283行和1284行)
for (var name in headers)
this.transport.setRequestHeader(name, headers[name]);
修改为:
for (var name in headers) {
if (!Object.isFunction(headers[name])) {
this.transport.setRequestHeader(name, headers[name]);
}
}
就是用Object.isFunction方法确定遍历到的header的属性不是一个函数(过滤掉toJSONString这个属性),“冲突之一”也就解决了。
注:我使用的js版本:prototype.js 1.6.0.3 、 http://www.json.org/json.js (2007-03-06)
写到这里,其实prototype.js里面也有json to string的方法(Object.toJSON):
var data = {error:'', data:''};
var json = Object.toJSON(data);
alert(json);
如果不是必须使用这两个js,建议您只使用prototype.js
prototype.js与json.js并不是完全兼容的。主要冲突在于json.js为Object的原型增加了一个toJSONString的方法。
冲突之一:是prototype中发送ajax请求时,遍历了一个header Object,结果将toJSONString也误当作一个header属性发送,导致错误:
[Exception... "Component returned failure code: 0x80070057 (NS_ERROR_ILLEGAL_VALUE) [nsIXMLHttpRequest.setRequestHeader]" nsresult: "0x80070057 (NS_ERROR_ILLEGAL_VALUE)" location: "JS frame :: http://astlogo.com/cstmface/js/lib/prototype.js :: anonymous ::
line 1289" data: no]
如果您没有将ajax请求异常捕获,遇到这个冲突的时候会很诡异。即没有js错误提示,也没有发送请求。如果遇到这样的情况,请在Ajax.Request请求的选项中多加一个事件监听:
function x_load_testdata(id) {
new Ajax.Request('testdata.php',
{
method:'get',
onSuccess: function(transport){
},
onFailure: function(){ alert('Request failure') },
onException: function(x, e) { alert(e) }
});
}
确认一下是否因为这个冲突导致。
冲突之二:反过来,如果将prototype使用的所有Object都增加一个toJSONString方法,也会出现问题。由于prototype的继承关系比较复杂,有些对象因此会继承多个toJSONString方法,调用的时候就会出错。
2.解决冲突的方案
首先,请先加载prototype.js,后加载json.js,这样就可以避免出现“冲突之二”。
<script type="text/javascript" src="js/lib/prototype.js"></script>
<script type="text/javascript" src="js/lib/json.js"></script>
其次,要解决prototype的Ajax.Request异常,就需要修改prototype.js的代码了(就我自己来说很不想改,不过如果您的项目也是必须同时依赖这两个JS,请也按照下面步骤修改):
在prototype.js中找到:(大概位于第1283行和1284行)
for (var name in headers)
this.transport.setRequestHeader(name, headers[name]);
修改为:
for (var name in headers) {
if (!Object.isFunction(headers[name])) {
this.transport.setRequestHeader(name, headers[name]);
}
}
就是用Object.isFunction方法确定遍历到的header的属性不是一个函数(过滤掉toJSONString这个属性),“冲突之一”也就解决了。
注:我使用的js版本:prototype.js 1.6.0.3 、 http://www.json.org/json.js (2007-03-06)
写到这里,其实prototype.js里面也有json to string的方法(Object.toJSON):
var data = {error:'', data:''};
var json = Object.toJSON(data);
alert(json);
如果不是必须使用这两个js,建议您只使用prototype.js
相关文章推荐
- prototype.js 和json.js 冲突
- prototype.js与jquery共存的方法/冲突解决方法
- Jquery与其它js框架(MooTools以及Prototype、Dojo、YUI等等)之间共享冲突的解决办法
- jQuery validate插件与prototype.js冲突的解决办法
- 做过的一个SSH+prototype.js+json=Ajax的例子
- jquery.js和json.js冲突的问题
- 如何解决ecshop中jquery冲突?使用jquery.json.js代替transport.org.js中部份代码,完美解决问题。
- prototype.js 和jquery-1.6.2.js冲突问题解决方法
- 【jquery】JQuery 和 json.js 冲突问题
- js使用正则表达式和prototype实现jsonp转json
- json.js和jquery.js冲突:导致页面左下角出现感叹号报错“例外被抛出且未被接住”
- 赏"金"猎人-Prototype.js与jQuery.js冲突,noConflict未果
- 解决prototype.js与jquery.js两个js冲突的办法。
- JQuery 和 json.js 冲突问题
- 小技巧解决JS中prototype入侵导致的代码冲突
- prototype.js与百度编辑器冲突
- 用json2.js 代替 json.js防止与jQuery的js冲突
- 关于使用struts2与jsp时,使用prototype.js的$属性与jquery的$冲突问题
- JS面向对象(2) -- this的使用,对象之间的赋值,for...in语句,delete使用,成员方法,json对象的使用,prototype的使用,原型继承与原型链
- 快速解决js开发下拉框中blur与click冲突