Использование JavaScript для проверки формы как на onblur, так и при нажатии submit

Я пытаюсь проверить поля в форме, используя JavaScript. Поля должны быть проверены либо тогда, когда пользователь покидает поле (onblur), либо когда пользователь нажимает "Отправить". Форму не следует отправлять, если проверка не выполняется каким-либо образом в обязательном поле.

Дело в том, что у меня также есть функция JS, которая, если проверка прошла успешно, должна переписать одно из проверяемых полей и отправить форму.

Это мой HTML:

<head>
    <meta charset='UTF-8'>

    <script type="text/javascript" src="./library/checkcreateuser.js"></script>
    <script type="text/javascript" src="./library/hashcreateuser.js"></script>
</head>

<body>
    <div class="maindiv">
        <form name="createform" id="createform" onsubmit="return formhash();" action="#" method="post">
            <input type="text" name="email" id="email" onblur="checkEmail()" placeholder="E-postadress" maxlength="50" />
            <label for="email" id="labemail"></label><br />
            <input type="text" name="testemail" id="testemail" onblur="checkEmailConfirm()" placeholder="Bekräfta e-postadress" maxlength="50" /><br />
            <label for="testemail" id="labtestemail"></label><br />
            <br />
            ... other input fields that should be validated, not yet written ...
            <br />
            <input type="password" name="password" id="password" placeholder="Lösenord" maxlength="50" /><br />
            <label for="password" id="labpassword"></label><br />
            <input type="password" name="testpassword" id="testpassword" placeholder="Bekräfta lösenord" maxlength="50" /><br />
            <label for="testpassword" id="labtestpassword"></label><br />
            <br />
            <input type="submit" placeholder="Registrera" onclick="validateForm()"><br />
        </form>
    </div>
</body>

И это мой JavaScript для проверки:

function checkEmail() {
    var validemail = true;

    var email = document.getElementById("email");

    var divided = email.split("@");

    var divlen = divided.length;

    if (divlen != 2) {
        validemail = false;
        document.getElementById("labemail").innerHTML = "Felaktig e-postadress";
    } else {
        document.getElementById("labemail").innerHTML = "<font color='#00cc00'>Korrekt epostadress</font>";
    }

    // More code to validate Email to come

    return validemail;
}

function checkEmailConfirm() {
    var validtestemail = true;

    var email = document.getElementById("email");
    var testemail = document.getElementById("email");

    if (testemail != email) validtestemail = false;

    return validtestemail;
}


function validateForm() {
    var validform = true;
    var returnval = true;

    validform = checkEmail();
    if (validform == false) returnval = false;
    validform = checkEmailConfirm();
    if (validform == false) returnval = false;

    return returnval;
}

Моя проблема в том, что ничего не происходит, когда я покидаю поля email или testemail.

Мой второй вопрос: если я хочу, чтобы форма не была отправлена, если какая-либо из проверок завершилась неудачно, но была отправлена, а также хэширована с использованием функции formhash(), если проверки пройдены успешно, это правильный путь?


РЕДАКТИРОВАТЬ: Используя отладчик Chrome, у меня есть следующие ошибки:

Uncaught TypeError: undefined is not a function: checkcreateuser.js:9  
checkEmail: checkcreateuser.js:9  
onblur: newuser.php:16  

1 ответ

Решение

Чтобы проверить значение, введенное в email и testemail, вы должны использовать:

  var email = document.getElementById("email").value;
    var testemail = document.getElementById("testemail").value;// then use split on these values.

если вы будете использовать

var email = document.getElementById("email");//you will get error may be like split is not a function or something similar.
Другие вопросы по тегам