форма onsubmit() в мобильном браузере

В настоящее время я использую функцию javascript для события onsubmit() моей формы, чтобы проверить, не пусты ли все входные данные.

Это отлично работает на компьютере, но на мобильном телефоне он меняет цвет фона (как я хочу сделать, когда ввод пуст), но все равно отправляет форму !!!

Моя форма:

<form id="formContact" action="envoi-message.php" method="post" class="normal" onsubmit="return valideChamps();">
            <div class="ddl">
                <span>VOUS ÊTES...</span>
                <div class="ddlOption">
                    <ul>
                        <li onclick="ddlContact('entreprise')"><span>UNE ENTREPRISE</span></li>
                        <li onclick="ddlContact('ecole')"><span>UNE &Eacute;COLE</span></li>
                        <li onclick="ddlContact('personne')"><span>UNE PERSONNE</span></li>
                    </ul>
                </div>
            </div>
            <input class="cache" type="text" name="entreprise" placeholder="NOM DE L'ENTREPRISE" />
            <input class="cache" type="text" name="ecole" placeholder="NOM DE L'&Eacute;COLE" />
            <input type="text" name="nom" placeholder="VOTRE NOM" />
            <input type="email" name="email" placeholder="VOTRE EMAIL" />
            <textarea name="message" placeholder="VOTRE MESSAGE" ></textarea>
            <input id="btnEnvoi" type="submit" value="Envoyer">
        </form>

Моя функция:

    function valideChamps(){
    var bResult = true;
    if ($("input[name*='nom']").val() == "") {
        $("input[name*='nom']").addClass("error");
        bResult = false;
    } else {
        $("input[name*='nom']").removeClass("error");
    }
    if ($("input[name*='email']").val() == "") {
        $("input[name*='email']").addClass("error");
        bResult = false;
    } else {
        var regex = /^(([^<>()[\]\\.,;:\s@\"]+(\.[^<>()[\]\\.,;:\s@\"]+)*)|(\".+\"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/;
        if (regex.test($("input[name*='email']").val()) == false ) {
            $("input[name*='email']").addClass("error");
            bResult = false;
        } else {
            $("input[name*='email']").removeClass("error");
        }
    }                                      
    if ($("#formContact textarea").val() == ""){
        $("#formContact textarea").addClass("error");
        bResult = false;
    }else {
        $("#formContact textarea").removeClass("error");
    }
    if ($("div.ddl > span").text().contains("entreprise")){
        if ($("input[name*='entreprise']").val() == "") {
            $("input[name*='entreprise']").addClass("error");
            bResult = false;
        }else {
            $("input[name*='entreprise']").removeClass("error");
        }
    } else if ($("div.ddl > span").text().contains("école")){
        if ($("input[name*='ecole']").val() == "") {
            $("input[name*='ecole']").addClass("error");
            bResult = false;
        }else {
            $("input[name*='ecole']").removeClass("error");
        }
    }
    return bResult;
}

Вы хоть представляете, что не так...? С уважением Одри

РЕДАКТИРОВАТЬ: я изменил кнопку отправки; Я помещаю onclick, который отправляет форму, если bResut == true


mobile javascript browser forms onsubmit
person Audrey    schedule 03.03.2015    source источник
comment
Дайте определение мобильному телефону. Какие браузеры вы тестировали? Все ли они демонстрируют такое поведение? Вы проверили, что bResult содержит ожидаемое значение?   -  person Quentin    schedule 03.03.2015
comment
Атрибут-заполнитель HTML5 не заменяет элемент label   -  person Quentin    schedule 03.03.2015

Ответы (2)


arrow_upward
0
arrow_downward

Попробуйте зарегистрировать обработчик отправки в форме с помощью JS, чтобы вы могли получить доступ к событию и вызвать preventDefault() вместо возврата false (или в дополнение к нему); Вот так:

document.getElementById('formContact').onsubmit = function(e) {
  //your validateChamps stuff goes here
if(!bResult) e.preventDefault();
};
person qbcat    schedule 03.03.2015
comment
Спасибо за ваш ответ, но даже если он работает на компьютере, на мобильном всегда одна и та же проблема... :( - person Audrey; 03.03.2015

arrow_upward
0
arrow_downward

РЕДАКТИРОВАТЬ: я изменил кнопку отправки; Я помещаю onclick, который отправляет форму, если bResut == true

person Audrey    schedule 04.03.2015