覆蓋jQuery函數 - 最佳實踐

我的web應用程序正在使用一些JQuery插件，如Datatables，它是相應的Row Reordering和Sorting插件。覆蓋jQuery函數 - 最佳實踐

問題是我們需要添加一些修復來解決惱人的IE8不一致問題。

因此，例如，在其中一個插件_mouseDrag（）方法中，我們需要在開始時添加一些額外的邏輯。有沒有辦法在不修改插件的源代碼的情況下重寫此函數？

在OO語言中，通常會覆蓋類方法，添加一些邏輯，然後調用super（）方法以避免修改API的源代碼。

因此，我想知道如何在不修改庫本身的情況下最好地支持JavaScript。

感謝

更新問題

基於下面的例子中，我怎麼重寫它存在作爲第三方庫下面我_mouseDrag功能：

(function($, undefined) { 

$.widget("ui.sortable", $.ui.mouse, { 

_mouseDrag: function (event){ 

... 

}

怎麼辦我完全重寫這個？

來源

2012-09-19 DJ180

試試這個（見演示：http://jsfiddle.net/2rZN7/）：

(function ($) { 
    var oldPluginFunction = $.fn.pluginFunction; 

    $.fn.pluginFunction = function() { 
    // your code 
    return oldPluginFunction.call(this); 
    }; 
})(jQuery);

從演示：

HTML：

<span id="text1">text1</span> 
<span id="text2">text2</span>

的JavaScript：

// define and use plugin 

$.fn.pluginFunction = function (color) { 
    return this.each(function() { 
    $(this).css('color', color); 
    }); 
}; 

$('#text1').pluginFunction('red'); 

// redefine and use plugin 

(function ($) { 
    var oldPluginFunction = $.fn.pluginFunction; 

    $.fn.pluginFunction = function() { 
    $(this).css('font-size', 24) 
    return oldPluginFunction.apply(this, arguments); 
    }; 
})(jQuery); 

$('#text2').pluginFunction('red');

來源

2012-09-19 02:38:34

你介意在最後解釋函數（$）部分和（jQuery）嗎？謝謝！ – DJ180

@ DJ180查看「IIFE」（立即調用函數表達式） – 2012-09-19 02:42:33

我明白了。這聽起來正是我正在尋找的。將先嚐試一下。謝謝 – DJ180

您可以通過它的原型在一個單獨的文件，而無需如下修改原始的源文件來覆蓋插件方法::

(function ($) { 
    $.ui.draggable.prototype._mouseDrag = function(event, noPropagation) { 

     // Your Code 
    }, 

    $.ui.resizable.prototype._mouseDrag = function(event) { 
      // Your code 
    } 
}(jQuery));

現在把你的邏輯在這裏或原始代碼是需要在你的項目中的新思路。

來源

2013-11-15 05:08:33

覆蓋jQuery函數 - 最佳實踐

回答

相關問題