单击链接时停止切换答案

【问题标题】：Stop Toggle when clicking on the link单击链接时停止切换
【发布时间】：2013-03-02 05:02:34
【问题描述】：

我正在尝试在一个网站上实现一个特定的部分，当我点击一个链接时它会向下切换，如果页面上已经有一个切换，那么它将关闭它并打开这个选定的一个。

问题是我想要它，所以当您单击特定链接时，它将停止一起切换并删除它。目前，每当您第二次单击该链接时，它都会显示一个 div。

代码如下：

    $('#nav a').click(function () {
    var headerItem = $(this).attr('data-header');
    if ($('#header_container').is(':visible')) {
        $('#header_container').slideUp(500, function() {
            $('.header_item').hide();
            $('#'+headerItem).show();
            $('#header_container').slideToggle(500);
        });
    }
    else {
        $('#'+headerItem).show();
        $('#header_container').slideToggle(500);
    }

});

希望这是有道理的。

【问题讨论】：

所以你想要它，所以如果链接已经被第一次点击（并且展开发生），你不希望任何额外的点击来重新关闭和重新展开已经打开的项目？就像点击一次click_0，让它展开。然后再次单击click_0，您不想发生任何事情吗？如果您单击click_01，您希望它现在的行为（关闭，重新打开），是吗？
@Walls 我希望能够单击它，它会展开，当您再次单击该链接时，它会停止展开.. 希望这是有道理的像这样：jsfiddle.net/r79Nu/1 但具有上述功能
所以你希望它喜欢中途切换？在您的小提琴示例中，当click_0 再次快速单击它时，停止向下滑动功能？因此，您不想显示整个文本块，而是希望停止并让它隐藏该文本的其余部分（第二次单击停止幻灯片时未显示的内容）？因此，在您的示例中，您只会显示 1-2 行而不是完整的 4 行？
@Walls 对不起。像这样：jsfiddle.net/r79Nu/1你点击“click_0”然后它向下切换，它显示内容。如果你再次点击，它会停止切换，它不会再次显示它，直到你再次点击链接，它会切换它..有意义吗？
所以你想要一个缓慢的揭示？我仍然对您想要的功能感到困惑。听起来您希望在 3 次点击分组中完成任务，是吗？单击 1：开始向下切换显示。单击 2：在当前点停止切换？或者？？？点击3：回滚？

标签： jquery html

【解决方案1】：

我会尝试一下我认为你想要的。同样，非常不清楚所需的功能是什么。这将与第一次单击展开正确的文本（标题 1 或 2）一起使用，然后在第二次单击到该初始单击点时，它会缩回封面。这隐藏了显示的数据，因此当您单击1 时，您将获得1 的数据，反之亦然2。这是正确的功能吗？

http://jsfiddle.net/r79Nu/23/

【讨论】：

如果这不是我们想要的，我做了一个小调整来处理错误项目在奇怪情况下显示的文本。 jsfiddle.net/r79Nu/27 是一个新版本。让我知道这是否正确或功能中是否缺少某些内容。 手指交叉
@user1326876 有用吗？！看起来确实如此，希望这是您要找的。span>

【解决方案2】：

添加此代码，以便在已选择时不会切换。

$('#nav a').click(function () {
    var headerItem = $(this).attr('data-header');
    if ($('#header_container #'+headerItem).is(':visible')) {
        $('#header_container').slideUp(500);  // or whatever method to make it disappear
        return false;
    } 
    .... rest of your code ...
}

【讨论】：

您好，感谢您的回复。但遗憾的是没有。请看：link[/link]
如果你一次又一次地点击它，它会保持不变。我以为这就是你想要的。你想处理快速点击吗？
我希望它关闭切换开关。所以当你再次点击它时，“蓝色”会隐藏起来，直到你再次点击它时它会掉下来。
那么，如果已经显示出来了，像修改后的代码一样隐藏如何？