Question

我刚刚创建了一个带有活动类的fadeIn / fadeOut菜单。请参阅以下代码：

jQuery(document).ready(function ($) {


var navItem1 = $('#exemption-nav-1'),
    navItem2 = $('#exemption-nav-2'),
    navItem3 = $('#exemption-nav-3'),
    displayItem1 = $('#exemption-item-1'),
    displayItem2 = $('#exemption-item-2'),
    displayItem3 = $('#exemption-item-3');


function fadeOutAll() {
    (displayItem1).stop().fadeOut('slow', function () {
        navItem1.removeClass('exemption-active');
        (displayItem2).stop().fadeOut('slow', function () {
            navItem2.removeClass('exemption-active');
            (displayItem3).stop().fadeOut('slow', function () {
                navItem3.removeClass('exemption-active');
            });
        });
    });
}

navItem1.click(function (e) {
    e.preventDefault();
    e.stopImmediatePropagation();
    fadeOutAll(function () {
        navItem1.addClass('exemption-active');
        displayItem1.stop().fadeIn();
    });
});


navItem2.click(function (e) {
    e.preventDefault();
    e.stopImmediatePropagation();
    fadeOutAll(function () {
        navItem2.addClass('exemption-active');
        displayItem2.stop().fadeIn();
    });
});


navItem3.click(function (e) {
    e.preventDefault();
    e.stopImmediatePropagation();
    fadeOutAll(function () {
        navItem3.addClass('exemption-active');
        displayItem3.stop().fadeIn();
    });
});
});

所以我在没有调用“fadeOutAll”函数的情况下工作，但是当我实际创建该函数时，它都会中断。有什么想法吗？

总而言之，我希望它能够在活动显示的标签之间切换。看到这个JSFIDDLE正如你所看到的那样有效，但我只是想通过一个函数来使用代码。这可能吗？

Answer 1

基本上你的代码问题归结为：

＆＃13;

function doThis() {
  // do nothing
}

$("#clickme").click(function() {
  doThis(function() {
    alert("clicked");
  });
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<button type='button' id='clickme'>click</button>

＆＃13;

哪个......没什么。

您需要告诉fadeOutAll（上面doThis）它将接收匿名/内联函数以及如何处理它：

＆＃13;

function doThis(todo) {
  todo();
}

$("#clickme").click(function() {
  doThis(function() {
    alert("clicked");
  });
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<button type='button' id='clickme'>click</button>

＆＃13;

jQuery函数不做预期的事情

1 个答案: