Question

我想创建一个表单，将数据提交到我的php脚本并将这些数据发布回我的页面。这是我的页面

<!DOCTYPE html>
<html>
    <head>
        <title>AJAX POST</title>
        <script src="jquery.js"></script>
        <script>
            $(document).ready(function(){
                $("input[name="submit"]").click(function(){
                    var username=$("input[name="username"]").attr("value");
                    var password=$("input[name="password"]").attr("value");
                    var data1=encodeURIComponent(username);
                    var data2=encodeURIComponent(password);
                    $.post("response.php",data1+"&"+data2,function(data){
                        $("#form").hide();
                        $("#response").html(data);
                    });
                });
            });
        </script>
    </head>
    <body>
        <div id="form">
            <form action="response.php" method="post">
                <input type="text" name="username" value=""/><br/>
                <input type="password" name="password" value=""/><br/>
                <input type="button" name="submit" value="submit"/>
            </form>
        </div>
        <div id="response"></div>
    </body>
</html>

这是我的服务器端脚本，名为response.php

<?php
    echo $_POST["username"]."<br/>";
    echo $_POST["password"];
?>

我无法得到预期的结果。请帮忙！

Answer 1

以密钥/值对形式发送数据：

$.post("response.php", {username: data1, password: data2} ,function(data){
    $("#form").hide();
    $("#response").html(data);
});

最好不要以明文形式存储密码......：D

Answer 2

我想这个：

.post("response.php",data1+"&"+data2,function(data){

应该是：

$.post("response.php",data1+"&"+data2,function(data){

Answer 3

您有自己应该发现的语法错误using the console of your browser。

例如更改

$("input[name="submit"]").click(function(){

到

$('input[name="submit"]').click(function(){

具有语法突出显示的编辑器也会有所帮助，您可能已经注意到了这一点。

Answer 4

可能是因为您在以下电话中遗漏了$：

$.post("response.php",data1+"&"+data2,function(data){

$("#form").hide();
$("#response").html(data);

});

JQuery ajax post功能不起作用

4 个答案: