0

当我在同一页面上包含这两个文件时，代码似乎不起作用。是什么导致了冲突？我似乎无法弄清楚。我是 js 新手，仍在学习，因此不胜感激。谢谢！

文件1：

$(document).ready(function(){

    var items = $('#stage li'),
        itemsByTags = {};

    // Looping though all the li items:

    items.each(function(i){
        var elem = $(this),
            tags = elem.data('tags').split(',');

        // Adding a data-id attribute. Required by the Quicksand plugin:
        elem.attr('data-id',i);

        $.each(tags,function(key,value){

            // Removing extra whitespace:
            value = $.trim(value);

            if(!(value in itemsByTags)){
                // Create an empty array to hold this item:
                itemsByTags[value] = [];
            }

            // Each item is added to one array per tag:
            itemsByTags[value].push(elem);
        });

    });

    // Creating the "Everything" option in the menu:
    createList('All',items);

    // Looping though the arrays in itemsByTags:
    $.each(itemsByTags,function(k,v){
        createList(k,v);
    });

    $('#filter a').live('click',function(e){
        var link = $(this);

        link.addClass('active').siblings().removeClass('active');

        // Using the Quicksand plugin to animate the li items.
        // It uses data('list') defined by our createList function:

        $('#stage').quicksand(link.data('list').find('li'),
                              function() {
                                 $("a.fsand").fancybox({
                                    'overlayShow'   : false,
                                    'transitionIn'  : 'elastic',
                                    'transitionOut' : 'elastic'
                                });
                                $(".play").click(function() {
                                    $.fancybox({
                                            'padding'       : 0,
                                            'autoScale'     : false,
                                            'transitionIn'  : 'none',
                                            'transitionOut' : 'none',
                                            'title'         : this.title,
                                            'width'     : 680,
                                            'height'        : 495,
                                            'href'          : this.href.replace(new RegExp("watch\\?v=", "i"), 'v/'),
                                            'type'          : 'swf',
                                            'swf'           : {
                                                 'wmode'        : 'transparent',
                                                'allowfullscreen'   : 'true'
                                            }
                                        });

                                    return false;
                                });  
                              });
        e.preventDefault();
    });

    $('#filter a:first').click();

    function createList(text,items){

        // This is a helper function that takes the
        // text of a menu button and array of li items

        // Creating an empty unordered list:
        var ul = $('<ul>',{'class':'hidden'});

        $.each(items,function(){
            // Creating a copy of each li item
            // and adding it to the list:

            $(this).clone().appendTo(ul);
        });

        ul.appendTo('#gal-container');

        // Creating a menu item. The unordered list is added
        // as a data parameter (available via .data('list'):

        var a = $('<a>',{
            html: text,
            href:'#',
            data: {list:ul}
        }).appendTo('#filter');
    }

    $("a#example1").fancybox({
        'overlayShow'   : false,
        'transitionIn'  : 'elastic',
        'transitionOut' : 'elastic'
    });

});
//]]>

文件2：

this.molitorscripts = function () {

    //FILTER EFFECTS & APPEARANCE
    var filterLink = jQuery('#filter a');
    filterLink.click(function(){

        jQuery('li.box').removeClass('hideMe');

        filterLink.not(this).removeClass('active');
        jQuery(this).addClass('active');

        var activeCat = jQuery(this).html().toLowerCase().replace(/ /g,'');

        jQuery('li.postEvent').not('li.'+ activeCat).addClass('hideMe').children().stop(true,true).animate({opacity:".1"},350);
        jQuery('li.'+ activeCat).children().stop(true,true).animate({opacity:"1"},350);

        return false;
    });
    jQuery('#filter li').not(':first').prepend("/ &nbsp;&nbsp;&nbsp;");


}
jQuery.noConflict(); jQuery(document).ready(function(){molitorscripts();});
4

1 回答 1

3

将第一个文件中的第一行从

$(document).ready(function(){

到

$(document).ready(function($){

第二个文件使用jQuery.noConflict()，它禁用对象的$别名jQuery。由于第一个文件中的所有内容都包含在 document.ready 处理程序中，因此您可以利用该处理程序自动传递 jQuery 对象这一事实，您可以$在本地调用该对象。

于 2013-08-27T22:52:37.460 回答