通过Ajax POST无法正常工作

时间:2015-05-04 10:00:38

标签: javascript php jquery ajax

我现在查看了各种StackOverflow页面和其他网站 - 但无法找到解决我问题的正确方法。我尝试通过Post发布两个值到php页面:

loginframe.php:

<form class="signin">
        <input type="username" id="inputUsername" class="control" placeholder="Username" required autofocus>
        <input type="password" id="inputPassword" class="control" placeholder="Password" required>
        <div id="remember" class="checkbox">
            <label>
                <input type="checkbox" value="remember-me">Remember me
            </label>
        </div>
        <button class="btn-login" type="submit" value="login" id="btn-login">Sign in</button>
    </form>

我的js:

$(document).ready(function(){
    $("#btn-login").click(function(){

        var username = $("#inputUsername").val();
        var password = $("#inputPassword").val();

        $.ajax(
        {
            type: "POST",
            url: 'login.php',
            data: {
                user: username,
                pass: password
            },
            success: function(result)
            {
                $("#result").html(result);
            }
        });
    });

});

我的login.php

<?php
    if(isset($_POST['user']) && isset($_POST['pass']))
    {
        echo $_POST['user'];
        echo $_POST['pass'];
    } else {
        include 'loginframe.php';
    }

这个login.php现在只是检查数据是否通过。绝对不是这样的。它总是打开loginframe.php ... 我无法找到错误 - 感谢您的帮助!非常感谢你。

1 个答案:

答案 0 :(得分:2)

使用防止默认方法。

$(document).ready(function(){
        $("#btn-login").click(function(event){

            event.preventDefault(); // this one prevents the default submission of the form

            var username = $("#inputUsername").val();
            var password = $("#inputPassword").val();

            $.ajax(
            {
                type: "POST",
                url: 'login.php',
                data: {
                    user: username,
                    pass: password
                },
                success: function(result)
                {
                    $("#result").html(result);
                }
            });
        });

    });