jQuery手风琴单击特定元素上的触发器

我对一个简单的jQuery手风琴脚本有问题。我在本页中使用它列出了一些事件：

我遇到的问题是，当用户单击包装器中的任何位置时，脚本就会崩溃。我需要脚本只有在用户单击事件标题时才能折叠

您可以看到这个JSFIDLE存在相同的问题：

我正在使用的脚本的完整代码可以在这里找到：

这是HTML：

<div id="va-accordion" class="va-container" style="">
    <div class="va-wrapper">
        <div class="va-slice" style="opacity: 1;">
            <div class="va-title" style="">
                <h2>Relationship, 26 February 2013</h2>
            </div>
            <div class="va-content" style="display: block;">
                <div class="event-left"></div>
                <div class="event-right"></div>
            </div>
        </div>
        <div class="va-slice" style="opacity: 0.2;">
        <div class="va-slice" style="opacity: 0.2;">
    </div>
</div>

关系，2013年2月26日

我遇到的问题是，当用户单击包装器中的任何位置时，脚本就会崩溃。 我需要脚本只有在用户单击事件标题时才能折叠

为了得到您想要的结果，您必须在事件到达accordion根元素之前阻止它的传播。 仅当单击

.va content

元素时，才需要执行此操作

$(function() {
    $('#va-accordion').vaccordion();
    $(".va-content").click(function(e) {
        e.stopPropagation();                    
    });
});

为什么这样做？

事件从根元素开始传播到目标元素（捕获阶段），到达目标之后， 它们爬回根元素（冒泡阶段）。 目标元素是接收事件的元素

可以在捕获阶段和冒泡阶段注册事件侦听器。 这里，我们使用jQuery在冒泡阶段注册事件

stopPropagation

允许阻止事件通过DOM传播

这是我写的一篇文章，以防你需要更多的信息