Question

在clickPrev();函数上，我正在移除类动画，我将返回上一页。

我需要按照我的所有功能直到点击.prev然后，我再次加载“（'../views/product-page.html”类.anamate未被正确删除，因为函数继续触发类.animate

我是否需要阻止回调？

    $('.show-content').on('click', function(e){
    e.preventDefault();

    var href = $(this).attr('href');
    $('#load-content').load('../views/product-page.html ' + href);

    $('.container').addClass('loaded', function() {
        $('#load-content').html('<img id="loader" src="../assets/images/bx_loader.gif">');
        $('#loader').css({ border:'none', position:'absolute', top:'24px', left:'48px', boxShadow:'none' });
    });


    // Now add Class Animate once the CSS3 transition is ended
    $("#load-content").bind("transitionend webkitTransitionEnd oTransitionEnd MSTransitionEnd", function(){
        $(this).addClass('animate');
        clickPrev();
    });

    });

//now GO BACK to previews page and repeat the transition and remove the classes.
    clickPrev = function () {
        $('#load-content .prev').on('click', function (){

        $('.animate').removeClass('animate');

        $("#load-content").bind("transitionend webkitTransitionEnd oTransitionEnd MSTransitionEnd", function(){
        $('.loaded').removeClass('loaded');
        $('#show-content').remove();
        $('.animate').removeClass('animate');
    });

       });
     }

Answer 1

尝试使用此代码。让我知道它是否有效..

        $(document).ready(function () {
        $('.show-content').on('click', function (e) {
            e.preventDefault();

            var href = $(this).attr('href');
            $('#load-content').load('../views/product-page.html ' + href);

            $('.container').addClass('loaded');


            // Now add Class Animate once the CSS3 transition is ended
            $("#load-content").bind("transitionend webkitTransitionEnd oTransitionEnd MSTransitionEnd", function () {
                $(this).addClass('animate');
                $('#load-content .prev').trigger("click");
            });

        });
        //now GO BACK to previews page and repeat the transition and remove the classes.
        $('#load-content .prev').on('click', function (e) {
            e.preventDefault();
            $('.animate').removeClass('animate');

            $("#load-content").bind("transitionend webkitTransitionEnd oTransitionEnd MSTransitionEnd", function () {
                $('.loaded').removeClass('loaded');
                $('#show-content').remove();
                $('.animate').removeClass('animate');
            });
        });
    });

Jquery函数加载内容和删除不重复它

1 个答案: