JQuery mobile - вернуть ложь, не мешая отправке формы

Question

alert() отлично работает, но return false не мешает публикации формы - есть идеи?

<script type="text/javascript">
function form_val() {
    //Check date
    var email=document.getElementById('email').value;
    var passw=document.getElementById('password').value;
    if(email==''||email==null||passw==''||passw==null) {
        alert('Please fill in both fields.');
        return false;
    }  

}
</script>

<form action="userlogin.html" method="post" name="log_form" onsubmit="return form_val();">
    <div data-role="fieldcontain">
        <input type="email" name="email" id="email" value="" placeholder="Email Address" />
        <input type="password" name="password" id="password" value="" placeholder="Password" />
        <div class="ui-grid-a">
        <div class="ui-block-a">
            <button type="submit" name="login" value="" data-theme="c">Sign In</button>
        </div>
        <div class="ui-block-b">
            <br />
            <a href="http://mobile.*****.com/lostpswd.html" rel="external" style="font-size:10px; padding-left:10px;">Forgotten Password?</a>
        </div>
    </div>
</form>

Answer 1

Вы отметили свой вопрос jquery-mobile, но нигде в цитируемом коде не используете jQuery.

Код выглядит прямо в старомодном виде DOM0 (что нормально и должно работать, за исключением проблем с getElementById в IE7 и более ранних ). Я бы немного изменил чеки в form_val:

function form_val(){
    //Check date
    var email=document.getElementById('email').value;
    var passw=document.getElementById('password').value;
    if(!email || !passw) {
        alert('Please fill in both fields.');
        return false;
    }  
}

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

Вот как вы можете использовать jQuery (который автоматически устраняет ошибку IE):

jQuery(function($) {
    $("form[name='log_form']").submit(form_val);
});
function form_val() {
    if (!$("#email").val() || !$("#password").val()) {
        alert('Please fill in both fields.');
        return false;
    }
}

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

jQuery(function($) {
    $("form[name='log_form']").submit(form_val);
    function form_val() {
        if (!$("#email").val() || !$("#password").val()) {
            alert('Please fill in both fields.');
            return false;
        }
    }
});

Answer 2

Вы можете использовать обычный тип «кнопка» вместо «отправить». Затем позвоните в JavaScript для подтверждения и отправки формы.