jQuery中isFunction方法的BUG修复
2010-01-25 00:00
761 查看
jQuery 1.4 源码 449 行(core.js 431 行),判断是否为函数的方法如下(思路来源于 Douglas Crockford 的《The Miller Device》):
isFunction: function( obj ) {
return toString.call(obj) === "[object Function]";
},
同时 jQuery 的作者也作了部分注释:
See test/unit/core.js for details concerning isFunction. Since version 1.3, DOM methods and functions like alert aren't supported. They return false on IE (#2968).
即:此方法在 IE 下无法正确识别 DOM 方法和一些函数(例如 alert 方法等)。
为什么会这样呢?
修复 jQuery 中 isFunction 方法的 BUG
使用 typeof 运算符检测各种方法:
document.writeln('typeof eval: ' + typeof eval + '
');
document.writeln('typeof confirm: ' + typeof confirm + '
');
document.writeln('typeof confirm: ' + typeof window.open + '
');
document.writeln('typeof alert: ' + typeof alert + '
');
document.writeln('typeof window.alert: ' + typeof window.alert + '
');
document.writeln('typeof document.getElementById: ' + typeof document.getElementById + '
');
document.writeln('typeof document.createElement: ' + typeof document.createElement + '
');
测试原始的 isFunction 函数方法
var isFunction = function( fn, name ) {
return document.writeln('isFunction(' + name + '): ' + (Object.prototype.toString.call(fn) === "[object Function]") + '
');
}
isFunction(eval,'eval');
isFunction(confirm, 'confirm');
isFunction(window.open, 'window.open');
isFunction(alert, 'alert');
isFunction(window.alert, 'window.alert');
isFunction(document.getElementById, 'document.getElementById');
isFunction(document.createElement, 'document.createElement');
isFunction(isFunction, 'isFunction');
测试修复后 isFunction 函数方法
var isFunction = (function() {
return typeof document.getElementById === "object" ?
isFunction = function(fn, name){
try {
return document.writeln('isFunction(' + name + '): ' + (/^\s*\bfunction\b/.test("" + fn)) + '
');
} catch (x) {
return document.writeln('isFunction(' + name + '): ' + (false) + '
');
}
}:
isFunction = function(fn, name){
return document.writeln('isFunction(' + name + '): ' + ("[object Function]" === Object.prototype.toString.call(fn)) + '
');
};
})()
isFunction(eval,'eval');
isFunction(confirm, 'confirm');
isFunction(window.open, 'window.open');
isFunction(alert, 'alert');
isFunction(window.alert, 'window.alert');
isFunction(document.getElementById, 'document.getElementById');
isFunction(document.createElement, 'document.createElement');
isFunction(isFunction, 'isFunction');
[Ctrl+A 全选 注:如需引入外部Js需刷新才能执行]
会发现在 IE 下用 typeof 检测 alert、confirm 方法以及 DOM 的方法显示 object,而其他浏览器下显示 function。
那如何完善这个问题呢?
typeof 检测某个方法(例如:document.getElementById) 是否是 object,如何是,则重写 isFunction 函数;
怎样重写呢?正则判断传入的对象字符串后(”" + fn),是否起始位置含有 function,即:/^\s*\bfunction\b/.test(” + fn)。
OK,看下根据以上思路修改后的 isFunction 函数:
参考阅读:
《isFunction hacked, isCallable solution》
《isFunction() or isObject(), that is the question ? 》
《Lazy Function Definition Pattern》
AKPC_IDS += "376,";
isFunction: function( obj ) {
return toString.call(obj) === "[object Function]";
},
同时 jQuery 的作者也作了部分注释:
See test/unit/core.js for details concerning isFunction. Since version 1.3, DOM methods and functions like alert aren't supported. They return false on IE (#2968).
即:此方法在 IE 下无法正确识别 DOM 方法和一些函数(例如 alert 方法等)。
为什么会这样呢?
修复 jQuery 中 isFunction 方法的 BUG
使用 typeof 运算符检测各种方法:
document.writeln('typeof eval: ' + typeof eval + '
');
document.writeln('typeof confirm: ' + typeof confirm + '
');
document.writeln('typeof confirm: ' + typeof window.open + '
');
document.writeln('typeof alert: ' + typeof alert + '
');
document.writeln('typeof window.alert: ' + typeof window.alert + '
');
document.writeln('typeof document.getElementById: ' + typeof document.getElementById + '
');
document.writeln('typeof document.createElement: ' + typeof document.createElement + '
');
测试原始的 isFunction 函数方法
var isFunction = function( fn, name ) {
return document.writeln('isFunction(' + name + '): ' + (Object.prototype.toString.call(fn) === "[object Function]") + '
');
}
isFunction(eval,'eval');
isFunction(confirm, 'confirm');
isFunction(window.open, 'window.open');
isFunction(alert, 'alert');
isFunction(window.alert, 'window.alert');
isFunction(document.getElementById, 'document.getElementById');
isFunction(document.createElement, 'document.createElement');
isFunction(isFunction, 'isFunction');
测试修复后 isFunction 函数方法
var isFunction = (function() {
return typeof document.getElementById === "object" ?
isFunction = function(fn, name){
try {
return document.writeln('isFunction(' + name + '): ' + (/^\s*\bfunction\b/.test("" + fn)) + '
');
} catch (x) {
return document.writeln('isFunction(' + name + '): ' + (false) + '
');
}
}:
isFunction = function(fn, name){
return document.writeln('isFunction(' + name + '): ' + ("[object Function]" === Object.prototype.toString.call(fn)) + '
');
};
})()
isFunction(eval,'eval');
isFunction(confirm, 'confirm');
isFunction(window.open, 'window.open');
isFunction(alert, 'alert');
isFunction(window.alert, 'window.alert');
isFunction(document.getElementById, 'document.getElementById');
isFunction(document.createElement, 'document.createElement');
isFunction(isFunction, 'isFunction');
[Ctrl+A 全选 注:如需引入外部Js需刷新才能执行]
会发现在 IE 下用 typeof 检测 alert、confirm 方法以及 DOM 的方法显示 object,而其他浏览器下显示 function。
那如何完善这个问题呢?
typeof 检测某个方法(例如:document.getElementById) 是否是 object,如何是,则重写 isFunction 函数;
怎样重写呢?正则判断传入的对象字符串后(”" + fn),是否起始位置含有 function,即:/^\s*\bfunction\b/.test(” + fn)。
OK,看下根据以上思路修改后的 isFunction 函数:
var isFunction = (function() { // Performance optimization: Lazy Function Definition return "object" === typeof document.getElementById ? isFunction = function(fn){ try { return /^\s*\bfunction\b/.test("" + fn); } catch (x) { return false } }: isFunction = function(fn){ return "[object Function]" === Object.prototype.toString.call(fn); };})()
参考阅读:
《isFunction hacked, isCallable solution》
《isFunction() or isObject(), that is the question ? 》
《Lazy Function Definition Pattern》
AKPC_IDS += "376,";
相关文章推荐
- jquery中的工具方法$.isFunction, $.isArray(), $.isWindow()
- jquery中的工具使用方法$.isFunction, $.isArray(), $.isWindow()
- jquery的clone方法应用于textarea和select的bug修复
- jquery中的工具方法$.isFunction, $.isArray(), $.isWindow()
- jQuery的isFunction方法源码分析
- jquery中的工具使用方法$.isFunction, $.isArray(), $.isWindow()
- jQuery中isFunction方法的BUG修复
- 使用jquery获取网页中图片高度的两种方法
- jquery 设置style:display的方法
- jquery类似方法的比较(一)
- jQuery中siblings()方法用法实例
- jQuery方法大全
- JQuery模拟三------利用extend函数扩展jQuery自身的方法和浏览器判断
- jquery阻止子元素触发父元素的事件的方法
- 记解决jQuery $.getJSON() 传递参数中文乱码问题的方法
- jquery----trim方法
- Jquery使用Ajax构建方法得不到返回值的问题
- jQuery实现鼠标点击弹出渐变层的方法
- jquery点击倍数次数不同调用方法不同
- JQuery2.2.3版本中toggle被淘汰后的替代方法