Question

我有这个代码，我想在joomla网站中使用它。我一直试图将它放入使用codemirror，jce或者根本没有编辑器的文章或模块中，但是切换根本不起作用，因此答案不会显示出来。我也尝试将它放入iframe，但是自动高度出现问题，没有修复就足够了。任何帮助都会受到高度赞赏，因为在搜索网络48小时后找到解决方案后，我现在似乎处于死胡同状态。提前谢谢！

<script src="diabetes-faq/js/jquery-1.9.1.min.js"></script>
    <script>
        $(document).ready(function() {
            $('#faq-list h2').click(function() {

                $(this).next('.answer').slideToggle(500);
                $(this).toggleClass('close');

            });
        }); // end ready
    </script>
<body>
<div id="wrapper">
<div id="main">
           <section id="faq-list">

                <h2>Question No1</h2>
                <div class="answer">
                    <p>blah blah blah</p>
                </div>


                <h2>Question No2</h2>
                <div class="answer">
                    <p>blah blah </p>
                </div>


                <h2>Question No3</h2>
                <div class="answer">
                    <p>blah blah blah</p>
                </div>

</section>
</div>
</div>
</body>

Answer 1

只需将其添加为正确的答案，以便更容易看到。所以你提到了jQuery和Mootools之间的冲突。

在这种情况下，您是对的，全局范围应该是更改，但您也可以使用通过的别名。

此外，如果你正在使用Joomla 3.x，那么不要导入你自己的jQuery副本。我写了一个回答，显示你在Joomla 2.5和3.x中导入jQuery：

Importing jQuery into Joomla

至于脚本，我建议使用它：

<script>
    jQuery(document).ready(function($) 
    {
        $('#faq-list h2').on('click', function() 
        {                
            var $self = $(this);

            $self.next('.answer').slideToggle(500);
            $self.toggleClass('close');

        });
    });
</script>

更新

你滑落的原因有点小，因为你使用的浮动效果并不适合与幻灯片等动画一起使用。

style.css 文件的 30 ，您需要更改

h2.close {
    float: left;
}

为：

h2.close {
    float: none;
}

带有切换答案的FAQ页面使用jQuery不能在joomla模块中工作

1 个答案:

更新