Question

我有一个我为SharePoint撰写的手风琴菜单：

<Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
    <Button Content="Click Me" x:Name="ClickMe" Background="Blue" Grid.Row="2"  Width="100" Height="100" Foreground="White">
        <Button.Template>
            <ControlTemplate TargetType="Button">
                <Border
                    x:Name="ButtonBackground"
                    BorderBrush="{TemplateBinding BorderBrush}"
                    BorderThickness="{TemplateBinding BorderThickness}"
                    CornerRadius="100" Background="{TemplateBinding Background}">
                    <Border
                        x:Name="PressedHighlightBackground"
                        Background="Transparent"
                        CornerRadius="100">
                        <ContentControl x:Name="ContentContainer"
                            Foreground="{TemplateBinding Foreground}"
                            HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
                            VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
                            Padding="{TemplateBinding Padding}"
                            Content="{TemplateBinding Content}"
                            ContentTemplate="{TemplateBinding ContentTemplate}"/>
                    </Border>
                    <VisualStateManager.VisualStateGroups>
                        <VisualStateGroup x:Name="CommonStates">
                            <VisualState x:Name="Normal"/>
                            <VisualState x:Name="PointerOver">
                                <VisualState.Setters>
                                    <Setter
                                        Target="ContentContainer.Foreground"
                                        Value="Pink" />
                                    <Setter
                                        Target="PressedHighlightBackground.Background"
                                        Value="Blue" />
                                    <Setter
                                        Target="ButtonBackground.BorderBrush"
                                        Value="{StaticResource AppBarBackgroundThemeBrush}" />
                                </VisualState.Setters>
                            </VisualState>
                            <VisualState x:Name="Pressed">
                                <VisualState.Setters>
                                    <Setter
                                        Target="ContentContainer.Foreground"
                                        Value="Black" />
                                    <Setter
                                        Target="PressedHighlightBackground.Background"
                                        Value="{StaticResource AppBarBackgroundThemeBrush}" />
                                    <Setter
                                        Target="ButtonBackground.BorderBrush"
                                        Value="{StaticResource AppBarBackgroundThemeBrush}" />
                                </VisualState.Setters>
                            </VisualState>
                            <VisualState x:Name="Disabled">

                            </VisualState>
                        </VisualStateGroup>
                    </VisualStateManager.VisualStateGroups>
                </Border>
            </ControlTemplate>
        </Button.Template>
    </Button>
</Grid>

我遇到的问题是家长parent.click(function(event) { event.preventDefault(); var childUL = $(this).closest("li").find("> ul"); var isVisible = childUL.is(":visible"); if($(e.target).hasId("#zz12_V4QuickLaunchMenu ul > ul > li > a")){ e.stopPropagation(); } else if (isVisible) { childUL.slideUp(); } else { childUL.slideDown(); } });。如果父列表项具有网址，我必须使用<li>来确保preventDefault事件不会正常触发，以便显示子菜单。但是，我发现这是因为我已经阻止默认激活，所以当您点击它们而不是触发正常点击事件时，所有链接基本上都会向上/向下滑动。我无法弄清楚在哪里/如何实施解除绑定事件。

jsfiddle updated.

编辑：基于下面的答案，我找到了我需要的结构，并且能够停止传播。但是，它会为整个功能停止它。有人可以帮我找出正确的选择器吗？不熟悉下面建议的节点名称，因为它嵌套在SharePoint的500万个css类中。我想尽可能使用直接的选择器。如果您愿意提供帮助，请写下实际的例子，谢谢！

Answer 1

你需要：

确定点击是否在子菜单中的链接上
如果是，请应用event.stopPropagation();

然后，子菜单中的链接将表现得像普通链接一样。

进一步阅读： https://developer.mozilla.org/en/docs/Web/API/Event/stopPropagation

取消绑定手风琴的儿童

1 个答案: