jQuery显示/隐藏slideToggle不工作

Question

我试图将此FAQ template集成到Magento商店的“1列布局”。

显示/隐藏切换无法按预期工作，只要持续时间（400）结束，它就会隐藏起来。 您可以在现场检查：http://nutrija.com/faq

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

var faqTrigger = $('.cd-faq-trigger'), 

    //show faq content clicking on faqTrigger 
    faqTrigger.on('click', function(event){ 
     event.preventDefault(); 
     $(this).next('.cd-faq-content').slideToggle(400).end().parent('li').toggleClass('content-visible'); 
    }); 

} 

我试图改变一些参数，但失败了，请帮助。

Answer 1

执行content-visible类切换中的slideToggle回调

var faqTrigger = $('.cd-faq-trigger'), 

//show faq content clicking on faqTrigger 
faqTrigger.on('click', function(event){ 
     event.preventDefault(); 
     $(this).next('.cd-faq-content').slideToggle(400, function(){ 
       //Add toggle class here 
       faqTrigger.parent('li').toggleClass('content-visible'); 
     }); 
    }); 

} 

Answer 2

我有固定的问题，这个问题是与Magento的整合jQuery的

解决方案：

使用jQuery则必须在确保它使用'noConflict'模式。为此，请添加：

var $ j = jQuery.noConflict（）;

到您的jQuery脚本的末尾。

现在，改变任何jQuery代码如下。如果您有：

//show faq content clicking on faqTrigger 
faqTrigger.on('click', function(event){ 
    event.preventDefault(); 
    $(this).next('.cd-faq-content').slideToggle(400).end().parent('li').toggleClass('content-visible'); 
}); 

}

它改成：

//show faq content clicking on faqTrigger 
faqTrigger.on('click', function(event){ 
    event.preventDefault(); 
    $f(this).next('.cd-faq-content').slideToggle(400).end().parent('li').toggleClass('content-visible'); 
}); 

}