如何使javascript函数不再重复?

时间:2019-05-31 13:37:08

标签: javascript jquery

我正在编写一些功能来验证联系表格。一切正常,直到我得到第三个输入文本为止。

通常的想法是,每次用户单击“确定”按钮时,当前文本输入是否为空都将得到验证。如果没有,它将调用下一个函数。

我面临的问题是,由于某种原因,第三个函数仍在调用第一个函数,因此我得到了fadeIn和fadeOut的循环。我使用console.log看到了这一点。我以为问题是因为我在所有功能中都使用了相同的按钮btnForm,但我不知道。

在调用下一个函数后,我尝试使用return;,但没有用。 这是我的代码:

    //labels hidden by default, so parent().fadeIn works
    $("#label0").parent().hide();
    $("#label1").parent().hide();
    $("#label2").parent().hide();
    $("#label3").parent().hide();
    $("#label4").parent().hide();
    $("#label5").parent().hide();
    $("#btn-label5").parent().hide();
    $("#btn-form").parent().hide();

    $(".custom-radio").click(function() {
//         e.preventDefault();
        var inputForm = $("input[name='expect-form']");

        $("#aumentar-faturamento").click(function() {
            inputForm.val("Aumentar nosso faturamento.");
            console.log('faturamento'); 
            validaNome();
        });
        $("#nao-sabemos").click(function() {
            inputForm.val("Não sabemos o que esperar; sabemos apenas que precisa ser feito");
            validaNome();
        });
        $("#comunicar-cliente").click(function() {
            inputForm.val("Comunicar nosso cliente sobre algo específico");
            validaNome();
        });
        $("#estreitar-cliente").click(function() {
            inputForm.val("Estreitar nossa relação com o cliente");
            validaNome();
        });
        $("#outro-dropdown").click(function() {
            inputForm.val("Outro...");
            validaNome();
        });         
    })
        function validaNome() {
            var btnForm = $("#btn-form");

            var inputName = $("input[name='name-form']");

            $(".dropdown").fadeOut(function() {
                $("#label1").parent().fadeIn();
                $(btnForm).parent().fadeIn();
                $(btnForm).click(function(e) {
                    e.preventDefault();
                    if(inputName.val() == ""){
                        console.log('Vazio')
                        inputName.addClass("error");
                        setTimeout(function() {
                            inputName.removeClass("error");
                        }, 3000);
                    }else{
                        console.log('inputName is not empty');
                        validaEmail();
                    }
                })
            });
        }

        function validaEmail() {
            var btnForm = $("#btn-form");

            var inputEmail = $("input[name='email-form']");

            $("#label1").parent().fadeOut(function() {
                $("#label2").parent().fadeIn();
                $(btnForm).click(function(e) {
                    e.preventDefault();
                    if(inputEmail.val() == "") {
                        console.log('Email empty');
                        inputEmail.addClass("error");
                        setTimeout(function() {
                            inputEmail.removeClass("error");
                        }, 3000);                       
                    }else{
                        console.log('Email is not empty');
                        validaTel();
                    }
                })
            })

        }

        function validaTel() {
            var btnForm = $("#btn-form");

            var inputTel = $("input[name='tel-form']");

            $("#label2").parent().fadeOut(function() {
                $("#label3").parent().fadeIn();
                $(btnForm).click(function(e) {
                    e.preventDefault();
                    if(inputTel.val() == ""){
                        console.log('Tel empty');
                        inputTel.addClass("error");
                        setTimeout(function() {
                            inputTel.removeClass("error");
                        }, 3000);                       
                    }else{
                        console.log('Tel is not empty');
                    }
                })
            })
        }

我真的不知道我在做什么错。

@edit

validanome();之所以称为5x,是因为它是一个下拉菜单,在单击该下拉菜单中的任何选项后,他消失了,并且调用了该函数。

0 个答案:

没有答案