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

在slideToggle回调中进行content-visible类切换

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

我已经解决了这个问题，问题在于将jQuery与Magento集成在一起

<强>解决方案：

使用jQuery时，您必须确保它正在使用＆＃39; noConflict＆＃39;模式。为此，请添加：

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');
});

}

jQuery show / hide slideToggle无法正常工作

2 个答案: