javascript - Garmin prototype.js 与本地 jquery 文件冲突

Question

我有来自 Garmin 的prototype.js，它与我的 jquery.frm.js 冲突，如下面的代码片段中所写。

<script src="/public/js/jquery-ui-1.8.16.custom.min.js"></script>
<script type="text/javascript" src="/public/js/jquery.frm.js"></script>
<script type="text/javascript" src="http://developer.garmin.com/web/communicator-api/prototype/prototype.js"></script>

它会抛出错误“未捕获类型错误:未定义不是函数 - jquery.frm.js”这是 jquery.frm.js 代码的一小段(因为它太长了!)

var FRAMEWORK_PREFIX = "erpFrm";
(function( $ ){

$.frm = {
    priorityAccepted : new Array(0,1,2,3,4,5,6,7,8,9),
    initFunctions : new Array(),
    _isLoading : false,

    /*
     *   Pagination Variables
     */
    currentPage : 0,
    itemsPerPage: 100,
    paginationOffset: 3,
    /*
     * Use to define fast ffward
     */
    pace: 6,
    options: {},
    show: true,




    /**
     * Init function to run page is loaded
     * @returns {undefined}
     */
    init : function() {
        for(var i=0; i < this.initFunctions.length; i++) {
            this.initFunctions[i].callback();
        }
        return this;

    } ....
})( jQuery );

$(document).ready(function() {
    try {
        $.frm.init(); 
    } catch (e) {
        console.log(e.message);
        $.frm.showPopup(e.message);
    }

});

实际上document.ready并没有执行!怎么会这样？

基本上我尝试了两种解决方案 - 两者都应该加载 jquery.frm.js 内的脚本和代码，这就是为什么我在函数内或在 noConflict 之后调用脚本的原因

第一个解决方案

<script>
    (function($) {
        $.getScript('/public/js/jquery.frm.js').done(function(script, textStatus) {
           console.log(textStatus);
        }).fail(function(jqxhr, settings, exception) {
           console.log(exception);
        });
    })(jQuery);
</script>

此代码仍会返回相同的错误 - undefined 不是函数

第二种解决方案

<script>
    jQuery.noConflict();
    jQuery(document).ready(function($){
        $.getScript('/public/js/jquery.frm.js').done(function(script, textStatus) {
            console.log(textStatus);
        }).fail(function(jqxhr, settings, exception) {
            console.log(exception);
        });
    });
</script>

仍然存在相同的错误。

请给我一些关于如何解决该问题的见解。

Answer 1

您可以创建 jQuery 的别名并在脚本中使用。下面的示例代码取自 jquery official website 。希望这能解决您的问题。

var j = jQuery.noConflict();

// Do something with jQuery
j( "div p" ).hide();

// Do something with another library's $()
$( "content" ).style.display = "none";