Question

我试图用jQuery和php验证表单，我已经遵循了一些教程，但没有一个对我有用。我真的不知道发生了什么，我已经尝试了几种不同的方式，所以我希望有人知道这个问题是什么，为什么会发生以及如何解决它。

所以......这是我的login.php

<?php
    $meta_description = "Ingrese a su cuenta para poder realizar diferentes operaciones";
    $page_title = "Login - Estudio Benintendi";
    include("includes/header.php")
?>
    <form method="post" action="">
        <fieldset>
            <legend>Ingrese los siguientes datos para logearse</legend>
            <div id="resultado"></div>
            <label>Nombre de usuario</label>
            <div class="input-control text" data-role="input-control">
                <input type="text" id="username" placeholder="Ingrese su nombre de usuario..." required />
                <button class="btn-clear" tabindex="-1" type="button"></button>
            </div>
            <label>Contraseña</label>
            <div class="input-control password" data-role="input-control">
                <input type="password" id="password" placeholder="Ingrese su contraseña..." autofocus required />
                <button class="btn-reveal" tabindex="-1" type="button"></button>
                </div>
            <div class="input-control checkbox" data-role="input-control">
            <label>
                <input type="checkbox" checked>
                <span class="check"></span>
                Recordarme
                </label>
            </div>
            <p><button id="submit">Enviar</button></p>
        </fieldset>
    </form>

<?php include("includes/footer.php") ?>

这是我的login.js

$(document).ready( function(){
    $("#submit").on("click", function(){
        username = $("#username").val();
        password = $("#password").val();
        $.ajax({
                url: "/includes/validar_login.php",
                type: "POST",
                data: {username:username, password:password},
                done: function(resp){
                    if(resp == "true")
                    {
                        window.location = "index.php";
                    }
                    else
                    {
                        $("#resultado").html(resp);
                    }
                }   
            });
    });
});

这是我的php脚本实际连接到db

<?php
    require_once("config.php");

    session_start();

    $conn = new mysqli(DB_HOST, DB_USER, DB_PASSWORD, DB_DATABASE) or die ("No se pudo conectar a la base de datos");

    $username = $_POST["username"];
    $password = $_POST["password"];

    $sql = "SELECT Nombre FROM usuarios WHERE Nombre='$username' AND Password='$password'";

    $result = $conn->query($sql);

    if($result->num_rows == 1)
    {
        $_SESSION["username"] = $username;
        echo "true";
    }
    else
    {
        echo "false";
    }

    $conn->close();
?>

最后这是我的footer.php（我在所有页面中使用）

 </div>
        <!-- jQuery 2.1.1 -->
        <script src="js/jquery/jquery.min.js"></script>
        <!-- jQuery UI -->
        <script src="js/jquery/jquery.widget.min.js"></script>
        <!-- Cross-Browser plugin-->
        <script src="js/jquery/jquery.mousewheel.min.js"></script>
        <!-- Metro jQuery customs -->
        <script src="js/metro/metro.min.js"></script>

        <script src="js/login.js"></script>
    </body>
</html>

显然我想要从页脚中删除login.js，因为我不希望他在所有页面中显示，但是我还不能完成这项工作，所以我将它显示在所有页面中页。

提前致谢！

Answer 1

为你的js试试这个：

$(function(){
    $('#submit').click(function(){
        queryString = $(this).parents('form:first').serialize(); //serialize all valid form inputs/controls
        $.post('/includes/validar_login.php',queryString, function(data){
                    var resp = JSON.parse(data);
            if(resp == "true")
            {
                window.location = "index.php";
            }else{
                $("#resultado").html(data);
            }
        });
    });
});

```

在validar_login.php

中

将echo'true'和echo'false'更改为die（json_encode（'true'））并死掉（json_encode（'false'））

Answer 2

将缓存设置为false，将数据类型设置为json。

$("#submit").on("click", function(){
    var obj = {'username':$("#username").val(),'password':$("#password").val()};
    Post(obj);
});

function Post(arr) {
    console.log(arr);
    $.ajax({
        type: "POST",
        url: "/includes/validar_login.php",
        data: arr,
        cache: false,
        dataType: "json",
        success: function (response) {
            console.log(response);
        }
    });
}

对于你的php：

<?php

    $username = $_POST["username"];
    $password = $_POST["password"];

    $response = array('username'=>$username,'password'=>$password);
    echo json_encode($response);

如果得到任何回复，请查看控制台

使用jQuery问题登录表单验证

2 个答案: