如何防止点击手风琴标题的事件传播？

Question

我的 jquery 可排序插件有问题。确实，我有使用手风琴和可排序的项目（问题）。

我使用 sortable 的更新事件在每个问题手风琴中显示额外的内容。

但我的问题是，在对问题进行排序后，我移动的手风琴会自动打开。

这是一个重现问题的简单示例：http://jsfiddle.net/JwzH2/1/

尝试对问题进行排序，您会看到手风琴自动打开（有时它可能会正常工作，所以再试一次）。

有人知道如何解决它吗？

编辑：Fosco 给了我一个部分可行的解决方案，但仍然存在问题 => 它不适用于动态添加的元素（请参阅我的 cmets 关于他的回答）。

此外，看到代码在没有这一行的情况下仍然可以正常工作，我仍然感到惊讶： $('.hidden-content', question).show();。确实，有无这条线的事件传播应该是一样的

http://jsfiddle.net/JwzH2/38/

Answer 1

我相信您的答案就在 jQuery UI 的示例代码中：http://jqueryui.com/demos/accordion/sortable.html

$(function() {
    var stop = false;
    $( "#accordion h3" ).click(function( event ) {
        if ( stop ) {
            event.stopImmediatePropagation();
            event.preventDefault();
            stop = false;
        }
    });
    $( "#accordion" )
        .accordion({
            header: "> div > h3"
        })
        .sortable({
            axis: "y",
            handle: "h3",
            stop: function() {
                stop = true;
            }
        });
});
</script> 

注意stop 变量的使用，以及排序机制和点击处理程序如何捕获和操作它。

编辑：今天早上我花了一些时间处理您的动态内容问题，这就是我想出的。添加新项目时，我销毁并重新设置手风琴和适当的点击处理程序。我将点击处理程序设置和手风琴设置移动到函数中，并在最初和添加新项目时调用它们。它发生得如此之快，以至于我看不到任何闪烁或视觉问题，但您的里程可能会有所不同。在这里试一试：http://jsfiddle.net/JwzH2/41/