需要帮助了解JQuery的noConflict()函数中发生了什么

时间:2015-04-10 16:20:44

标签: javascript jquery html

我正在查看this site的源代码并尝试弄清楚Javascript的一部分是如何工作的,因为我想复制他们的扩展列表功能(例如“WHEN&我可以转到哪里出售门票和钱币“)进入我的网站。

源代码的第74-75行是

<script type="text/javascript" src="http://newjs.finalsite.com/150409/javascript/jQuery/jquery.min.js"></script>    
        <script type="text/javascript"> var $j = jQuery.noConflict(); </script>

基本上将$j设置为函数noConflict()返回的任何内容。

然后,在代码的底部,它们包含JS文件http://newjs.finalsite.com/150409/javascript/pages/multicontent/multi_expand.js,其中包含函数

$j(function(){
    if(clickToClose){
        $j('.mcExpandingList').accordion({
            collapsible:'true',
            autoHeight: false
        });
        if(!mc_viewOption1){ $j('.mcExpandingList').accordion( 'option', 'active', false ); }
    }else{
        $j('.mcExpandingList').addClass('ui-accordion ui-widget ui-helper-reset ui-accordion-icons');

        $j('.mcExpandingList h4').addClass('ui-accordion-header ui-helper-reset ui-state-default ui-corner-all')
        .prepend('<span class="ui-icon ui-icon-triangle-1-e"></span>')
        .hover(function(){ $j(this).toggleClass('ui-state-hover') })
        .click(function(){
            $j(this).toggleClass('ui-state-active ui-corner-top ui-corner-all');
            $j(this).next().toggle('blind');
            $j(this).find('span').eq(0).toggleClass('ui-icon-triangle-1-s');
            return false;
        });

        $j('.contentElement').addClass('ui-accordion-content ui-helper-reset ui-widget-content ui-corner-bottom').css('display','none');

        if (mc_viewOption1) {
            $j('.mcExpandingList h4').eq(0).toggleClass('ui-state-active ui-corner-top ui-corner-all');
            $j('.mcExpandingList h4').eq(0).next().show();
            $j('.mcExpandingList h4').eq(0).find('span').eq(0).addClass('ui-icon-triangle-1-s');
        };
    }
});

正如我所理解的那样,它正在将一个匿名函数传递给返回的noConflict()对象,这使我认为$j本身就是一个可以执行某些操作的函数。但是我对如何将上述函数作为click事件附加到扩展列表链接有点困惑。这里有没有人理解它,如果有的话,你能解释一下吗?

1 个答案:

答案 0 :(得分:1)

当包含jQuery时,它会存储以前具有的任何值window.$

当我们调用$j = jQuery.noConflict时,将window.$的值返回到其先前的状态。如果您使用Prototype也使用快捷方式$

,这非常有用

它还返回一个新的别名,以便我们可以通过$j引用jQuery。

如果您希望使用不带multi_expand.js的自定义别名jQuery来调整jQuery.noConflict,最简单的方法是使用匿名函数。

(function($j){
  // $j is jQuery
}(jQuery));

或者您可以将第一行更改为:

jQuery(function($j){ 
  // $j is jQuery

这基本上意味着;当文档准备就绪时,运行此函数,jQuery为$ j。

相关问题