javascript - 我的 jQuery Ajax 无法与 PHP 配合使用

Question

我正在尝试使用 jQuery Ajax Post 发布数据并接收响应，但我不确定为什么我的代码不起作用。

<script>
    $(document).ready(function(){
        $('#login').click(function(){
            $.ajax({
                type: 'POST',
                url: 'http://code.com/backend/test3',
                dataType: 'json',
                data: {"username":"akllkkj","password":"kljjkjkl"},
                cache: false,
                success: function(data){
                    console.log(data.stack);
                    console.log(data.key);
                },
                error:function(){
                    alert("failure");
                }
            });
            return false;
        });
    });
</script>

<form autocomplete="off" class="ui fluid form segment" method="post">
    <div class="ui fluid form segment">
        <div class="two fields">
            <div class="field">
                <label>Email/Username</label>
                <input placeholder="Email/Username" name="username" id="username" type="text">
            </div>
            <div class="field">
                <label>Password</label>
                <input placeholder="Password" name="password" id="password" type="password">
            </div>
        </div>
        <input type="button" class="ui fluid submit button" name="dosubmit" value="Submit" id="login" />
    </div>
</form>

我的 test3 页面包含:

<?php
if(isset($_POST['username']) && isset($_POST['password'])) {
    $arr = array(
        'stack'=>'overflow',
        'key'=>'value'
    );
    echo json_encode($arr);
}
?>

Answer 1

这对我有用:

$('#form').submit(function (event) {
    event.preventDefault();

    var data = $('#form').serialize();

    $.ajax({
        type: 'post',
        dataType: 'json',
        data: data
    }).done(function (resp) {
        console.log(resp);
    });
});

在 php 方面，您可能需要这样的东西:

header('Content-Type: application/json');
echo json_encode($arr);