jQuery：试图使 'if else' 语句利用 'noop' 使 link 惰性 - 不起作用

Question

最终，我试图让 link 在按下并调出相关的 div 后不起作用（我希望 link 在相关的 div 没有显示）。页面不会重新加载，因为 link 只会更改 div 正在显示的内容。

我有四个 link（'linkSweaters'、'linkService'、'linkContact' 和 'linkSeamstress'）对应于四个 div（ 'rightContentSweaters'、'rightContentService'、'rightContentContact' 和 'rightContentSeamstress'）。在任何时候，只应显示一个 div，而所有其他 div 应显示为 css：'display:none'。我还有一个 'rightContentSpacer' div，当我点击任何一个 link 时它会增加高度 - 从而与当时显示的 div 重叠，一旦重叠，我就可以消失 - 然后再次收缩以发现与推入的 link 相对应的 div （当 'rightContentSpacer' 与前一个 div 重叠时我会出现，从而实现从一个 div 到另一个的转换）。

我的问题：当我单击 link（例如 'linkSweaters'）时，我不想单击相同的 link 随后激活 jQuery 动画作为相关 div 已经显示（即 'rightContentSweaters'）- 即当显示 'rightContentSweaters' 时，我希望 'linkSweaters' link 在单击时不执行任何操作。

如下（在下面 jQuery 代码的底部），为了让点击 link 什么都不做我试过 ' $("#link毛衣").noop();';这是以其他三个 div（'rightContentService'、'rightContentContact' 和 'rightContentSeamstress'）未显示为条件的，即 css：'display:none'。这个想法是，如果其他三个 div 没有显示，那么这意味着（因为一个 div 必须在任何时候显示） 'rightContentSweaters' 必须显示。

尽管如此，在我原来的 CSS 中，三个 div（'rightContentSweaters'、'rightContentSeamstress' 和 'rightContentContact）以 'display:none' 开头，当页面最初加载；一个 div ('rightContentService') 不是以 'display:none' 开头，因为它已经显示：

#rightContentService {
                height: 90%;
                width:650px;
                margin:0 auto;
                background-color: red;
                position:absolute;
                display:block;
                }

 #rightContentSweaters {
                height: 90%;
                width:650px;
                margin:0 auto;
                background-color: red;
                position:absolute;
                display:none;
                }

因此我在底部添加了 jQuery 代码位（即具有延迟功能的位），这样一旦我点击了与原始代码不同的 link页面，'rightContentService' 变为 'display:none'；然后所有三个 div 的条件都是 'display:none' 将起作用。

我的jQuery如下：

$("#linkSweaters").click(function(){
    if ($('#rightContentService').css('display') == 'none' && $('#rightContentSeamstress').css('display') == 'none'){
    $("#rightContentSpacer").animate({
        height: "100%",
        },1000);
    $("#rightContentContact").animate({
        height: "0",
        },1000);
    $("#rightContentContact").hide({
        });
    $('#rightContentSweaters').delay(2000).slideDown(1000, function() {
        });
    $("#rightContentSpacer").delay(1000).animate({
        height: "10%",
        },1000);

} else if ($('#rightContentService').css('display') == 'none' && $('#rightContentContact').css('display') == 'none'){
    $("#rightContentSpacer").animate({
        height: "100%",
        },1000);
    $("#rightContentSeamstress").animate({
        height: "0",
        },1000);
    $("#rightContentSeamstress").hide({
        });
    $('#rightContentSweaters').delay(2000).slideDown(1000, function() {
        });
    $("#rightContentSpacer").delay(1000).animate({
        height: "10%",
        },1000);

} else if ($('#rightContentContact').css('display') == 'none' && $('#rightContentSeamstress').css('display') == 'none'){
    $("#rightContentSpacer").animate({
        height: "100%",
        },1000);
    $("#rightContentService").animate({
        height: "0",
        },1000);
    $("#rightContentService").hide({
        });
    $('#rightContentSweaters').delay(2000).slideDown(1000, function() {
        });
    $("#rightContentSpacer").delay(1000).animate({
       height: "10%",
       },1000);

} else if ($('#rightContentContact').css('display') == 'none' && $('#rightContentSeamstress').css('display') == 'none' && $('#rightContentService').css('display') == 'none'){
    $("#linkSweaters").noop();

    }

$('#rightContentService').delay(1000).queue(function (next) { 
    $(this).css('display', 'none'); 
    next(); 
    });

});

它不起作用 - 在显示 'rightContentSweaters' 的情况下，我仍然可以点击 'linkSweaters'。所以看起来要么 (A) 'noop' 不工作，要么 (B) 我的三条件 (x && y && z) 不工作。

你怎么看？

Answer 1

这不是 noop 方法的作用。它的作用其实完全没有。

noop 方法旨在用于需要调用函数的地方，但调用函数不应该做任何事情。而不是创建一个新的空函数，即 function(){} 你可以只使用 $.noop.

如果要从元素中移除点击事件处理程序，可以使用off方法：

$("#linkSweaters").off('click');

jQuery：试图使 'if else' 语句利用 'noop' 使 link 惰性 - 不起作用

jQuery: attempting to make an 'if else' statement utilise 'noop' to make link inert - not working

html

jquery

if-statement

hyperlink

noop