Question

您好我正在实现一个登录页面，从PHP端一切正常，但现在我将使用jQuery实现一个更多的功能：我想检查登录的字段是否为空，如果不是打印的话该页面，否则继续使用php，该怎么做？

以下是我的HTML代码的一部分：

<form id="loginForm" action="login-exec.php" name="loginForm" method="post" class="ui-body ui-body-a ui-corner-all" data-ajax="false">
    <fieldset>
        <div data-role="fieldcontain">
            <label class="ui-input-text" for="login">Login:</label>
            <input name="login" type="text" class="textfield" id="login" />
        </div>                                  
        <div data-role="fieldcontain">                                      
            <label class="ui-input-text" for="password">Password:</label>
            <input name="password" type="password" class="textfield" id="password"/> 
        </div>
        <input type="submit" name="Submit" value="Login" />
    </fieldset>
</form>

Answer 1

将事件绑定到提交表单（注意：不要单击提交按钮）。这就是你的代码检查表单的地方，如果有必要，阻止它被发布。

$('#loginForm').on('submit', function(e){
    if ($('#login').val()=='' || $('#password').val()==''){
        e.preventDefault();
        // alert('Fill in both fields');
        // You can use an alert or a dialog, but I'd go for a message on the page
        $('#errormsg').text('Fill in both fields').show();
    }else{
        // do nothing and let the form post
    }
});

如果您希望在页面的某个位置显示消息而不是使用对话框，最好在提交按钮附近添加errormsg div

<p id="errormsg" style="display:none;"></p>

在提交到php之前验证表单

1 个答案: