无法使用spaghetti jQuery代码创建模块

时间:2017-11-27 11:08:16

标签: javascript jquery module

我有一堆重复的jQuery,我无法弄清楚如何将它压缩成一个模块。我对模块缺乏经验,这不是一块很容易塑造的意大利面条。

我知道init chacheDOM bindEvents是什么,但我不知道如何解析这段代码。谁能帮我吗?我将非常感激。

            $(document).ready(function () {
            $('.content-licenties, .content-productorders').fadeOut(0);
            $('.tab-sub li:not(:first-child)').fadeOut(0)
        });

        $('#allesweergeven-licenties .sub-card-container p').click(function () {
            $('#allesweergeven-licenties .sub-card-container p').css('color', '');
            $(this).css('color', '#CD4F16');

            if ($(this).hasClass('sub-merkA-alle-licenties')) {
                $('.tab-merkA-alle-licenties').fadeIn(0);
                $('.tab-merkB-alle-licenties').fadeOut(0);
            }
            else if ($(this).hasClass('sub-merkB-alle-licenties')) {
                $('.tab-merkB-alle-licenties').fadeIn(0);
                $('.tab-merkA-alle-licenties').fadeOut(0);
            }
        });

        $('#actief-licenties .sub-card-container p').click(function () {
            $('#actief-licenties .sub-card-container p').css('color', '');
            $(this).css('color', '#CD4F16');

            if ($(this).hasClass('sub-merkA-actief-licenties')) {
                $('.tab-merkA-actief-licenties').fadeIn(0);
                $('.tab-merkB-actief-licenties').fadeOut(0);
            }
            else if ($(this).hasClass('sub-merkB-actief-licenties')) {
                $('.tab-merkB-actief-licenties').fadeIn(0);
                $('.tab-merkA-actief-licenties').fadeOut(0);
            }
        });

        $('#inactief-licenties .sub-card-container p').click(function () {
            $('#inactief-licenties .sub-card-container p').css('color', '');
            $(this).css('color', '#CD4F16');

            if ($(this).hasClass('sub-merkA-inactief-licenties')) {
                $('.tab-merkA-inactief-licenties').fadeIn(0);
                $('.tab-merkB-inactief-licenties').fadeOut(0);
            }
            else if ($(this).hasClass('sub-merkB-inactief-licenties')) {
                $('.tab-merkB-inactief-licenties').fadeIn(0);
                $('.tab-merkA-inactief-licenties').fadeOut(0);
            }
        });



        $('#offertes .sub-card-container p').click(function () {
            $('#offertes .sub-card-container p').css('color', '');
            $(this).css('color', '#CD4F16');

            if ($(this).hasClass('sub-openstaand-offertes')) {
                $('.tab-openstaand-offertes').fadeIn(0);
                $('.tab-gesloten-offertes').fadeOut(0);
            }
            else if ($(this).hasClass('sub-gesloten-offertes')) {
                $('.tab-gesloten-offertes').fadeIn(0);
                $('.tab-openstaand-offertes').fadeOut(0);
            }
        });

        $('#orders .sub-card-container p').click(function () {
            $('#orders .sub-card-container p').css('color', '');
            $(this).css('color', '#CD4F16');

            if ($(this).hasClass('sub-bevestigd-orders')) {
                $('.tab-bevestigd-orders').fadeIn(0);
                $('.tab-inbestelling-orders, .tab-verzonden-orders').fadeOut(0);
            }
            else if ($(this).hasClass('sub-inbestelling-orders')) {
                $('.tab-inbestelling-orders').fadeIn(0);
                $('.tab-bevestigd-orders, .tab-verzonden-orders').fadeOut(0);
            }
            else if ($(this).hasClass('sub-verzonden-orders')) {
                $('.tab-verzonden-orders').fadeIn(0);
                $('.tab-bevestigd-orders, .tab-inbestelling-orders').fadeOut(0);
            }
        });

        $('#facturen .sub-card-container p').click(function () {
            $('#facturen .sub-card-container p').css('color', '');
            $(this).css('color', '#CD4F16');

            //$('.breadcrumb').children().last().html($(this).html());

            if ($(this).hasClass('sub-openstaand-facturen')) {
                $('.tab-openstaand-facturen').fadeIn(0);
                $('.tab-betaald-facturen, .tab-gecrediteerd-facturen').fadeOut(0);
            }
            else if ($(this).hasClass('sub-betaald-facturen')) {
                $('.tab-betaald-facturen').fadeIn(0);
                $('.tab-openstaand-facturen, .tab-gecrediteerd-facturen').fadeOut(0);
            }
            else if ($(this).hasClass('sub-gecrediteerd-facturen')) {
                $('.tab-gecrediteerd-facturen').fadeIn(0);
                $('.tab-openstaand-facturen, .tab-betaald-facturen').fadeOut(0);
            }
        });

        function open_cards() {
            $('.content-productorders, .content-licenties').fadeOut(time);
            setTimeout(function(){
                $('.card, .profile').fadeIn(time);
            }, wait);
        }

        function open_offertes(){
            $('.card, .profile').fadeOut(time);
            setTimeout(function(){
                $('.content-productorders').fadeIn(time);
            }, wait);
            $('#offertes-tab').tab('show');
        }

        function open_orders(){
            $('.card, .profile').fadeOut(time);
            setTimeout(function(){time
                $('.content-productorders').fadeIn(time);
            }, wait);
            $('#orders-tab').tab('show');
        }

        function open_facturen(){
            $('.card, .profile').fadeOut(time);
            setTimeout(function(){
                $('.content-productorders').fadeIn(time);
            }, wait);
            $('#facturen-tab').tab('show');
        }

        function open_actieve_licenties(){
            $('.card, .profile').fadeOut(time);
            setTimeout(function(){
                $('.content-licenties').fadeIn(time);
            }, wait);
            $('#actief-licenties-tab').tab('show');
        }

        function open_inactieve_licenties(){
            $('.card, .profile').fadeOut(time);
            setTimeout(function(){
                $('.content-licenties').fadeIn(time);
            }, wait);
            $('#inactief-licenties-tab').tab('show');
        }

        function open_alle_licenties(){
            $('.card, .profile').fadeOut(time);
            setTimeout(function(){
                $('.content-licenties').fadeIn(time);
            }, wait);
            $('#allesweergeven-licenties-tab').tab('show');
        }


        var wait = 60;
        var time = 90;

0 个答案:

没有答案