Question

我在切换中切换但是它无法正常工作。切换只需要显示div有“点击”类（也可以切换），但有时你仍然可以点击..而且点击它时也不总是有用...我想我会去这完全是错的：到目前为止，这是我的代码并且无意识地看到我的意思 - fiddle

$(document).ready(function () {
    $('.timelineTile').click(function (evt) {
        evt.stopPropagation();
        $('.selected').children().not(this).removeClass('clicked');
        $(this).toggleClass('clicked');
        if ($('.selected').children().hasClass("clicked")) {
            $('.details').addClass('show');
        }
        if ($('.selected').children().hasClass("clicked")) {
            $(this).children('.item').click(function (e) {
                e.stopPropagation();
                $(this).siblings('.item-overlay').slideToggle('fast');
            });
        }
        if ($('.selected').children().not("clicked")) {
            $('.item-overlay').hide('fast');
        }
    });
});

$(document).click(function () {
    $('.timelineTile').removeClass('clicked');
    $('.details').removeClass('show');

    $('.item-overlay').hide('fast');
});

Answer 1

我不是100％确定该示例的意图，但是您在点击处理程序中连接了一个点击处理程序。我已将其移至外部并在新委派的单击处理程序中测试已点击子项的.selected祖先：

JSFiddle：http://jsfiddle.net/TrueBlueAussie/xmgb85p5/4/

$(document).ready(function () {
    // Click a tile
    $('.timelineTile').click(function (evt) {
        console.log(".timelineTile click");

        // Stop the click propogating
        evt.stopPropagation();

        // Remove clicked class from all other tiles and hide other overlays
        $('.timelineTile').not(this).removeClass('clicked').find('.item-overlay').hide("fast");

        // Toggle the current tile clicked class
        $(this).toggleClass('clicked');

        // If we are clicked, show details
        if ($(this).hasClass("clicked")) {
            $('.details', this).addClass('show');
        }
    }).on('click', '.item', function (e) {
        console.log(".item click");
        if ($(this).closest('.timelineTile').hasClass("clicked")) {
            e.stopPropagation();
            $(this).siblings('.item-overlay').slideToggle('fast');
        }
    });
});

$(document).click(function () {
    $('.timelineTile').removeClass('clicked');
    $('.details').removeClass('show');

    $('.item-overlay').hide('fast');
});

如果仍然不正确，请澄清预期的行为。

为什么内部切换不能正常工作

1 个答案: