slideToggle无法使用H1

Question

我正在尝试修改Skeleton Wordpress主题的切换面板布局。默认情况下，主题会在<p>元素中显示切换面板的标题/链接。我一直试图将其修改为<h1>元素并且收效甚微。

我试图尽可能简化代码，以便在此发布，希望它有意义：

HTML：

<div class="list"><h1 class="trigger"><a href="#">Title</a></h1>
    <div class="toggle_container">
        <div class="block">
            Toggle content
        </div>
    </div>
</div>

JS：

$(function(){ // run after page loads
            $(".toggle_container").hide();
            //Switch the "Open" and "Close" state per click then slide up/down (depending on open/close state)
            $("h1.trigger").click(function(){
                $(this).toggleClass("active").next().slideToggle("normal");
                return false; //Prevent the browser jump to the link anchor
            });
    });

我更改的唯一内容在HTML中用<p class="trigger">替换为<h1 class="trigger">，并在JS中将“p.trigger”更改为“h1.trigger”。

在代码中使用<p>时，切换按预期工作，但在代码中使用<h1>时则不行。我可以在两种方案中单击<a>元素，但只有当我使用<p>元素时，容器才会展开/滑动。

感谢任何帮助。提前谢谢！