Проверка формы Javascript

Question

Это действительно беспокоит меня. Я просто хочу, чтобы форма не отправлялась, если функция возвращает false. Вот сценарий.

function checkPass(){
                          var pass1 = document.getElementById('pass');
                          var pass2 = document.getElementById('pass2');
                          var message = document.getElementById('confirmMessage');
                          var goodColor = "#224466";
                          var badColor = "#900000";
                          if(pass1.value == pass2.value){
                            pass2.style.backgroundColor = goodColor;


                            return true;
                          }else{
                            pass2.style.backgroundColor = badColor;


                            return false;
                          }
                        }  

Форма все еще sumbit, когда я использую:

<form onsumbit="checkPass();">
</form>

и когда я пользователь

<form>
<input type="submit" onclick="checkPass();">
</form>

и не повезло. Есть идеи?

Answer 1

Используйте это для события onsubmit вашей формы :

onsubmit="return checkPass()"

Или этот для вашей кнопки Submit (тег ввода):

onclick="return checkForm()"

Answer 2

Если вы используете xhtml, убедитесь, что 'onsubmit' в нижнем регистре.

<form onsubmit="return checkPass()" ... >

Answer 3

Как говорит M2X, вам нужно использовать

<form onsubmit="return checkPass();">

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

Таким образом, ваш оригинальный атрибут onsubmit будет преобразован в:

function() {
    checkPass();
}

, который выполняет функцию checkPass, но отбрасывает возвращаемое значение. Включив return в атрибут, он будет преобразован в:

function() {
    return checkPass();
}

, который будет возвращать значение, возвращаемое ему функцией checkPass, тем самым достигая желаемого эффекта.