0

我试图找到在 javascript（或 jQuery）中执行函数（resetMenuPosition（））的最简单方法，仅当先前的函数（collapseExpandMainMenu（this））完成时。

原始代码

$('.trmenuClass').click(function () {
    $.when(collapseExpandMainMenu(this))
     .done(function () {
         resetMenuPosition();
     });
});

我尝试了 jQuery 的不同变体，但我认为我误用了 jQuery，因为我没有完全掌握延迟对象的概念。

感谢任何 javascript 或 jQuery 建议。

谢谢，-蒂姆

编辑后包含 collapseExpandMainMenu(this) 代码

function collapseExpandMainMenu(i, callback) {
    isCollapsing = ($(i).find('div').attr('class')) == 'minusSign';
    currentScrollTop = $('#contents').scrollTop();

    var fav, Dash, Conn, Hire, Retain, Activityreports;
    var favSubmnuHt = 0, dashSubmnuHt = 0, connSubmnuHt = 0, hireSubmnuHt = 0, retainSubmnuHt = 0, activityreportsSubmnuHt = 0;

    /*submenu height determination*/
    $('.trmenuClass').each(function () {
        if ($('tr.favtrClass').toggle().is(":visible")) {
            fav = 1;
        }
        else {
            fav = 0;
        }

        if ($('tr.dashboardtrClass').toggle().is(":visible")) {
            Dash = 1;
        }
        else {
            Dash = 0;
        }

        if ($('tr.connecttrClass').toggle().is(":visible")) {
            Conn = 1;
        }
        else {
            Conn = 0;
        }

        if ($('tr.hiretrClass').toggle().is(":visible")) {
            Hire = 1;
        }
        else {
            Hire = 0;
        }

        if ($('tr.retaintrClass').toggle().is(":visible")) {
            Retain = 1;
        }
        else {
            Retain = 0;
        }

        if ($('tr.activityreportstrClass').toggle().is(":visible")) {
            Activityreports = 1;
        }
        else {
            Activityreports = 0;
        }

    })

    /*This gets the height of each dynamically created submenu along with bottom border*/
    var favBottomBorder = 0; var dashBottomBorder = 0; var connectBottomBorder = 0; var hireBottomBorder = 0;
    var retainBottomBorder = 0; var activityreportsBottomBorder = 0;
    $('.favtrClass').each(function () {
        favSubmnuHt = favSubmnuHt + 35;
        favBottomBorder = favBottomBorder + 1;
    })

    $('.dashboardtrClass').each(function () {
        dashSubmnuHt = dashSubmnuHt + 35;
        dashBottomBorder = dashBottomBorder + 1;
    })

    $('.connecttrClass').each(function () {
        connSubmnuHt = connSubmnuHt + 35;
        connectBottomBorder = connectBottomBorder + 1;
    })

    $('.hiretrClass').each(function () {
        hireSubmnuHt = hireSubmnuHt + 35;
        hireBottomBorder = hireBottomBorder + 1;
    })

    $('.retaintrClass').each(function () {
        retainSubmnuHt = retainSubmnuHt + 35;
        retainBottomBorder = retainBottomBorder + 1;
    })

    $('.activityreportstrClass').each(function () {
        activityreportsSubmnuHt = activityreportsSubmnuHt + 35;
        activityreportsBottomBorder = activityreportsBottomBorder + 1;
    })

    /*submenu height determination */
    var varFav = favSubmnuHt - favBottomBorder;
    var varDash = dashSubmnuHt - dashBottomBorder;
    var varConn = connSubmnuHt - connectBottomBorder;
    var varHire = hireSubmnuHt - hireBottomBorder;
    var varRetain = retainSubmnuHt - retainBottomBorder;
    var varActivityreports = activityreportsSubmnuHt - activityreportsBottomBorder;
    var rowCount = ($('#contents tr').length) * 35;

    /*determination which submenu is open and which is closed*/
    if (fav == 1) { favSubmnuHt; }
    else if (fav == 0) { rowCount = rowCount - favSubmnuHt; }

    if (Dash == 1) { dashSubmnuHt; }
    else if (Dash == 0) { rowCount = rowCount - dashSubmnuHt; }

    if (Conn == 1) { connSubmnuHt; }
    else if (Conn == 0) { rowCount = rowCount - connSubmnuHt; }

    if (Hire == 1) { hireSubmnuHt; }
    else if (Hire == 0) { rowCount = rowCount - hireSubmnuHt; }

    if (Retain == 1) { retainSubmnuHt; }
    else if (Retain == 0) { rowCount = rowCount - retainSubmnuHt; }

    if (Activityreports == 1) { activityreportsSubmnuHt; }
    else if (Activityreports == 0) { rowCount = rowCount - activityreportsSubmnuHt; }


    var heightOfSubMenuCombined = 0;
    var idTotoggleSubMenu = $(i).closest('tr').attr('id');  // changes from "this" to "i"
    if (idTotoggleSubMenu == "favoritestrId") {
        $('tr.favtrClass').toggle(browserVar, function () { });
        if (fav == 1) {
            rowCount = rowCount - favSubmnuHt;
            if (rowCount > $('#contents').height()) {
                $('.scrollDownArrow').css({ visibility: "visible" });

            }
            else {
                $('.scrollDownArrow').css({ visibility: "hidden" });
                $('.scrollUpArrow').hide();
                $('.scrollUpArrow').css({ visibility: "hidden" });
                $(document).ready(resizingScrollbar);

            }
        }
        else if (fav == 0) {
            rowCount = rowCount + varFav;

            if (rowCount > $('#contents').height()) {
                $('.scrollDownArrow').css({ visibility: "visible" });
            }
            else {
                $('.scrollDownArrow').css({ visibility: "hidden" });
                $('.scrollUpArrow').hide();
                $('.scrollUpArrow').css({ visibility: "hidden" });
                $(document).ready(resizingScrollbar);

            }
        }
        /*Code to toggle plus and minus sign*/
        if ($('#favoritesMinusSignId').hasClass('minusSign')) {
            $('#favoritesMinusSignId').addClass('plusSign').removeClass('minusSign');
        }
        else if ($('#favoritesMinusSignId').hasClass('plusSign')) {
            $('#favoritesMinusSignId').addClass('minusSign').removeClass('plusSign');
        }

    }
    else if (idTotoggleSubMenu == "dashboardtrId") {
        /*Code to toggle submenu and make bottom scrolling arrow slide up and down*/

        $('tr.dashboardtrClass').toggle(browserVar, function () { });

        if (Dash == 1) {
            rowCount = rowCount - dashSubmnuHt;
            if (rowCount > $('#contents').height()) {
                $('.scrollDownArrow').css({ visibility: "visible" });
            }
            else {
                $('.scrollDownArrow').css({ visibility: "hidden" });
                $('.scrollUpArrow').hide();
                $('.scrollUpArrow').css({ visibility: "hidden" });
                $(document).ready(resizingScrollbar);

            }
        }
        else if (Dash == 0) {
            rowCount = rowCount + varDash;

            if (rowCount > $('#contents').height()) {
                $('.scrollDownArrow').css({ visibility: "visible" });
            }
            else {
                $('.scrollDownArrow').css({ visibility: "hidden" });
                $('.scrollUpArrow').hide();
                $('.scrollUpArrow').css({ visibility: "hidden" });
                $(document).ready(resizingScrollbar);
            }
        }

        /*Code to toggle plus and minus sign*/
        if ($('#dashboardMinusSignId').hasClass('minusSign')) {
            $('#dashboardMinusSignId').addClass('plusSign').removeClass('minusSign');
        }
        else if ($('#dashboardMinusSignId').hasClass('plusSign')) {
            $('#dashboardMinusSignId').addClass('minusSign').removeClass('plusSign');
        }

    }
    else if (idTotoggleSubMenu == "connecttrId") {
        /*Code to toggle submenu and make bottom scrolling arrow slide up and down*/
        $('tr.connecttrClass').toggle(browserVar, function () { });

        if (Conn == 1) {
            rowCount = rowCount - connSubmnuHt;

            if (rowCount > $('#contents').height()) {
                $('.scrollDownArrow').css({ visibility: "visible" });
            }
            else {
                $('.scrollDownArrow').css({ visibility: "hidden" });
                $('.scrollUpArrow').hide();
                $('.scrollUpArrow').css({ visibility: "hidden" });
                $(document).ready(resizingScrollbar);
            }
        }
        else if (Conn == 0) {
            rowCount = rowCount + varConn;

            if (rowCount > $('#contents').height()) {
                $('.scrollDownArrow').css({ visibility: "visible" });
            }
            else {
                $('.scrollDownArrow').css({ visibility: "hidden" });
                $('.scrollUpArrow').hide();
                $('.scrollUpArrow').css({ visibility: "hidden" });
                $(document).ready(resizingScrollbar);
            }
        }

        /*Code to toggle plus and minus sign*/
        if ($('#connectMinusSignId').hasClass('minusSign')) {
            $('#connectMinusSignId').addClass('plusSign').removeClass('minusSign');
        }
        else if ($('#connectMinusSignId').hasClass('plusSign')) {
            $('#connectMinusSignId').addClass('minusSign').removeClass('plusSign');
        }
    }
    else if (idTotoggleSubMenu == "hiretrId") {
        /*Code to toggle submenu and make bottom scrolling arrow slide up and down*/
        $('tr.hiretrClass').toggle(browserVar, function () { });

        if (Hire == 1) {
            rowCount = rowCount - hireSubmnuHt;

            if (rowCount > $('#contents').height()) {
                $('.scrollDownArrow').css({ visibility: "visible" });
            }
            else {
                $('.scrollDownArrow').css({ visibility: "hidden" });
                $('.scrollUpArrow').hide();
                $('.scrollUpArrow').css({ visibility: "hidden" });
                $(document).ready(resizingScrollbar);
            }
        }
        else if (Hire == 0) {
            rowCount = rowCount + varHire;

            if (rowCount > $('#contents').height()) {
                $('.scrollDownArrow').css({ visibility: "visible" });
            }
            else {
                $('.scrollDownArrow').css({ visibility: "hidden" });
                $('.scrollUpArrow').hide();
                $('.scrollUpArrow').css({ visibility: "hidden" });
                $(document).ready(resizingScrollbar);
            }
        }

        /*Code to toggle plus and minus sign*/
        if ($('#hireMinusSignId').hasClass('minusSign')) {
            $('#hireMinusSignId').addClass('plusSign').removeClass('minusSign');
        }
        else if ($('#hireMinusSignId').hasClass('plusSign')) {
            $('#hireMinusSignId').addClass('minusSign').removeClass('plusSign');
        }

    }
    else if (idTotoggleSubMenu == "retaintrId") {
        /*Code to toggle submenu and make bottom scrolling arrow slide up and down*/
        $('tr.retaintrClass').toggle(browserVar, function () { });

        if (Retain == 1) {
            rowCount = rowCount - retainSubmnuHt;

            if (rowCount > $('#contents').height()) {
                $('.scrollDownArrow').css({ visibility: "visible" });
            }
            else {
                $('.scrollDownArrow').css({ visibility: "hidden" });
                $('.scrollUpArrow').hide();
                $('.scrollUpArrow').css({ visibility: "hidden" });
                $(document).ready(resizingScrollbar);
            }
        }
        else if (Retain == 0) {
            rowCount = rowCount + varRetain;

            if (rowCount > $('#contents').height()) {
                $('.scrollDownArrow').css({ visibility: "visible" });
            }
            else {
                $('.scrollDownArrow').css({ visibility: "hidden" });
                $('.scrollUpArrow').hide();
                $('.scrollUpArrow').css({ visibility: "hidden" });
                $(document).ready(resizingScrollbar);
            }
        }

        /*Code to toggle plus and minus sign*/
        if ($('#retainMinusSignId').hasClass('minusSign')) {
            $('#retainMinusSignId').addClass('plusSign').removeClass('minusSign');
        }
        else if ($('#retainMinusSignId').hasClass('plusSign')) {
            $('#retainMinusSignId').addClass('minusSign').removeClass('plusSign');
        }
    }
    else if (idTotoggleSubMenu == "activityreportstrId") {
        /*Code to toggle submenu and make bottom scrolling arrow slide up and down*/
        $('tr.activityreportstrClass').toggle(browserVar, function () { });

        if (Activityreports == 1) {
            rowCount = rowCount - activityreportsSubmnuHt;

            if (rowCount > $('#contents').height()) {
                $('.scrollDownArrow').css({ visibility: "visible" });
            }
            else {
                $('.scrollDownArrow').css({ visibility: "hidden" });
                $('.scrollUpArrow').hide();
                $('.scrollUpArrow').css({ visibility: "hidden" });
                $(document).ready(resizingScrollbar);
            }
        }
        else if (Activityreports == 0) {
            rowCount = rowCount + varActivityreports;

            if (rowCount > $('#contents').height()) {
                $('.scrollDownArrow').css({ visibility: "visible" });
            }
            else {
                $('.scrollDownArrow').css({ visibility: "hidden" });
                $('.scrollUpArrow').hide();
                $('.scrollUpArrow').css({ visibility: "hidden" });
                $(document).ready(resizingScrollbar);
            }
        }

        /*Code to toggle plus and minus sign*/
        if ($('#activityreportsMinusSignId').hasClass('minusSign')) {
            $('#activityreportsMinusSignId').addClass('plusSign').removeClass('minusSign');
        }
        else if ($('#activityreportsMinusSignId').hasClass('plusSign')) {
            $('#activityreportsMinusSignId').addClass('minusSign').removeClass('plusSign');
        }
    }

    //setTimeout(function () {
        callback.call();
    //}, 400);
}

使用 JQUERY 的代码。然后

$('.trmenuClass').click(function () {
    (collapseExpandMainMenu(this)).then(
        function () { resetMenuPosition(); },
        function () { alert("Please close and re-open the menu."); }
    );
});

resetMenuPosition() 的开头行

    console.log('#menuTableId.height: ' + $('#menuTableId').css('height').replace(/px/g, ''));
    alert('pause');
    console.log('#menuTableId.height: ' + $('#menuTableId').css('height').replace(/px/g, ''));
4

2 回答 2

2

您collapseExpandMainMenu需要在完成时返回一个$.Deferred()（或一个承诺）对象并解决/拒绝。这是一个简单的例子：

var collapseExpandMainMenu = function () {
    var deferred = $.Deferred();

    setTimeout(function () {
        // some processing
        deferred.resolve('success!');
    }, 5000);

    return deferred.promise();
};

$.when(collapseExpandMainMenu(this))
    .done(function (message) {
        console.log(message); // logs "success!" after 5 seconds
    }
);

工作示例：http: //jsfiddle.net/3sGZh/

旁注：承诺是无法解决/拒绝的延迟 - 您将其提供给消费者，以便他们可以响应解决/拒绝，但不能自己执行。

于 2012-08-21T16:23:06.123 回答
0

只需使用回调：

$('.trmenuClass').on('click', function () {
    collapseExpandMainMenu(this, function() {
        console.log('success!'); // logs "success!" when animation completes
        resetMenuPosition();
    });
});

function collapseExpandMainMenu(elem, callback) {
     //do your stuff first, then call the callback
     $(elem).fadeIn(1000, function() {
          callback.call(); //waits until animation is complete
     });
}
于 2012-08-21T16:23:03.600 回答