0

在过去的观看日，我一直在努力解决我遇到的这个问题。我有一个页面，您可以将其视为产品查找器：在此处查看：http: //media-surfer.nl/test/

我想将此页面包含在我经营的芒果商店中：http: //ongedierteproducten.nl/bieb

我知道 Magento 使用原型和 scriptaculous，所以我使用了 jQuery.noConflict(); 虽然这启用了拇指功能，但排序菜单仍然不起作用。

如果有人能给我指点，我会欣喜若狂。

亲切的问候，杰森。

magento 页面中的 jQuery：

<!-- collapse expand jquery -->
<script type="text/javascript">
jQuery.noConflict();
jQuery(document).ready(function(){

        jQuery(".inhoud").hide();
        jQuery(".show_hide").show();

    jQuery(document).on('click','.show_hide', function(event) { 

        jQuery(".inhoud").parent().animate({
            width: '160'
          }, 500, function() {
            // Animation complete.
          });


        var $inhoud = jQuery(this).next(".inhoud");

        if($inhoud.hasClass("active")) 
        {
            jQuery(this).parent().animate({
                width: '160'
              }, 500, function() {
                // Animation complete.
              });
            $inhoud.removeClass("active");
            jQuery("div.inhoud").hide();
        } else {
            jQuery(this).parent().animate({
                width: '769'
              }, 500, function() {
                // Animation complete.
              });

            $inhoud.addClass("active");
            jQuery(this).next("div.inhoud").show();
        }

    });

});


<!-- filter plugin -->
<script charset="utf-8" type="text/javascript">
    jQuery.noConflict();
    jQuery(document).ready(function() {
        var _filterPortfolio = jQuery('#portfolio').filterPortfolio({
            initFilter: '#all', 
            itemUL: '#itemUL',
            filterButtons: [ 
                {'link': '#all', 'dom': 'li'}, 
                {'link': '#kruipt', 'dom': 'li.kruipt'}, 
                {'link': '#vliegt', 'dom': 'li.vliegt'}, 
                {'link': '#staart', 'dom': 'li.staart'} 
            ], 

            orderReverse: true,
            sortOption: {
                adjustHeight: 'auto',
                easeIn: 'fadeIn',
                easeOut: 'fadeOut'
            }
        });         

        jQuery("select#easeInType").change(selChange);  
        jQuery("select#easeOutType").change(selChange);             
        function selChange(){
            var _easeIn = jQuery('select#easeInType').val();
            var _easeOut = jQuery('select#easeOutType').val();              
            _filterPortfolio.updateAnimation(_easeIn, _easeOut);
            jQuery('#selections').hide();
        }

        jQuery('#toggleImg').on('click', function(event){
            jQuery('#selections').toggle();
        })                      


    });

4

1 回答 1

0

您可以将每个 jQuery 代码包装在一个匿名函数中，如下所示：

<script type="text/javascript">
;(function($){
    // all jQuery code:
    $(document).ready(function(){
    // your code
    });
})(jQuery);

如果可能，您应该将所有 js 代码放在 .js 文件中，而不是内联。

于 2013-04-24T12:25:15.063 回答