验证正确后隐藏表单

时间:2018-08-21 17:54:01

标签: javascript

所有验证正确之后,我需要能够隐藏我的表单

   window.addEventListener('load', init)

function init(e)
{

    var firstName = document.querySelector('#first-name');
    var lastName = document.querySelector('#last-name');
    var email = document.querySelector('#email');
    var emailConfirm = document.querySelector('#email-confirm');
    var phoneNumber = document.querySelector('#phone');
    var submit = document.querySelector('#submit');
    var input = document.querySelectorAll('input');
    var span = document.querySelectorAll('span');
    var label = document.querySelectorAll('label');
    var fields = document.querySelectorAll("#form input[type=text]");
    var form = document.querySelector('#form');


    submit.addEventListener('click', Edit);
    submit.addEventListener('click', Results);

    function Edit(e)
    {
        for (let i = 0; i < fields.length; i++)
        {
            if (fields[i].value=="")
            {
                span[i].innerHTML = "*";
                span[i].style.color = "red"
                label[i].style.color = "red";
            }
            else
            {
                span[i].innerHTML="";
                label[i].style.color = "black";
            }
        }

        if (email.value !== emailConfirm.value)
            {
                span[2].innerHTML = "Emails do not match";
                span[3].innerHTML = "Emails do not match"
            }
            else
            {
                span[2].innerHTML = "";
                span[3].innerHTML = "";
            }
    }

因此,一旦填写了所有字段,并且一旦电子邮件和电子邮件确认匹配,则单击提交后,我就需要隐藏表格,然后显示确认页面

1 个答案:

答案 0 :(得分:1)

由于您已经可以在JS代码中访问表单元素

 var form = document.querySelector('#form');

您所要做的就是

 form.style.display = 'none';

隐藏它。