Question

嗨，我是ajax的新手，我很难用基本的东西。我有一个mysql表＆＃34;用户＆＃34;具有用户信息，包括他们承诺捐赠的余额。我希望有一个div，当点击时将10添加到他们的余额并刷新下面显示的余额。我有以下页面。

<?php
    include_once 'login.php';
    $db_server = mysql_connect($db_hostname, $db_username, $db_password);
    mysql_select_db($db_database);

?>

<!DOCTYPE html>


<script src ="js/jquery-2.1.0.js"></script>
<script language="javascript" type="text/javascript">
        $(document).ready(
            function()
            {
                $("#click").click(
                    function()
                    {
                        var ten = 10;
                        $.ajax(
                            {
                                url:  "updatebalance.php",
                                type: "post",
                                data: ten,
                                success: function(data) {

                                     document.getElementById("balance").innerHTML = ""
                                     alert('it was successful');
                                 }
                            }
                        );
                    }
                );
            });
 </script>


<html>

    <body>
        <div id="click">Ten Dollars </div>
        <div id="balance">
            <?php 

                $query = "SELECT * FROM users WHERE email='xxxxx@xxx.com'";
                $result = mysql_query($query);
                $row = mysql_fetch_row($result);
                echo "$row[2]";

            ?>
        </div>    

    </body>
</html>

这是updatebalance.php代码：

<?php
    include_once 'login.php';    
    $db_server = mysql_connect($db_hostname, $db_username, $db_password);
    $newBal = $_POST['ten']; 
    mysql_select_db($db_database);
    $query = "UPDATE users SET balance='$newBal' WHERE email='xxxxx@xxx.com'";
    $result = mysql_query($query);
    if (!$result) die ("Database access failed: " . mysql_error());
?>

发生以下情况：

首次加载页面时：＆＃34;十美元＆＃34;与电子邮件＆x; xxxxx@xxx.com＆＃39;用户表中当前的余额一起显示; - 所以我知道连接数据库没有问题。
当我点击＆＃34; Ten Dollars＆＃34;时，会弹出警告，表示它已成功但数据库中的值未更改。平衡的div只是空白，因为我不知道如何在成功之后改变它：＆＃34; ...
当我运行updatebalance.php并为$ newBal输入一个数字（例如4）时，它会在表格中正确更新。
我也意识到我拥有它以便新的余额值为10，而不是之前的余额+10，但这是因为我试图减少可能发生错误的地方。

Answer 1

由于您使用的是ajax，因此您必须返回变量然后输出，目前您并不是在检查您是否正在发送警报时取得成功一个响应，其中包括您的错误代码。

你可以使用响应变量（在这种情况下，响应是变量数据）来做到这一点，它应该能够让你有能力看到你要返回的内容，不过如果它没有更新数据库那么＆＃几乎可以肯定你的失败信息。

在这种特定情况下，你实际传递的post变量是$ _POST [0] =＆＃39; 10＆＃39;不是$ _POST [十]。您需要将数据作为对象传递，以便以这种方式访问它：

data: { ten: ten }

我还建议使用与您要访问的变量不同的名称，或者按照以下方式执行某些操作：

        $(document).ready(
        function()
        {
            $("#click").click(
                function()
                {
                    var post = { ten: ""}
                    var ten = 10;
                    var post.ten = ten;
                    $.ajax(
                        {
                            url:  "updatebalance.php",
                            type: "post",
                            data: post,
                            success: function(data) {

                                 document.getElementById("balance").innerHTML = "";
                                 alert('it was successful');
                             }
                        }
                    );
                }
            );
        });

为了避免由于10为变量名而导致10：10可能导致的潜在混淆和不稳定行为。

编辑：错过了分号。

Answer 2

更好的方法

发送用户电子邮件ID而不是十个
dataType：json （回复）
更新查询将旧列更新为10并返回成功 json响应（错误标志设置为0）。
在 AJAX成功上使用jquery来更新旧div（id = balance）新的更新余额
在更新页面中提取 $ emailid = $ _POST ['emailid'] 以进行更新电子邮件ID

主页

<!DOCTYPE html>


<script src ="js/jquery-2.1.0.js"></script>
<script language="javascript" type="text/javascript">
        $(document).ready(
            function()
            {
                $("#click").click(
                    function()
                    {
                        var emailid = xxxxx@xxx.com;
                        $.ajax(
                            {
                                url:  "updatebalance.php",
                                type: "post",
                                data: { emailid: xxxxx@xxx.com },
                                dataType:json,
                                success: function(data) {

                                        if(! data.error)
                                        {
                                            var old_balance = $('#balance').text();
                                            $('#balance').text() = old_balance + 10;
                                            alert('it was successful');
                                        }
                                        else
                                        {
                                            alert('Oops seems some error occured !');
                                        }

                                 }
                            }
                        );
                    }
                );
            });
 </script>


<html>

    <body>
        <div id="click">Ten Dollars </div>
        <div id="balance">
            <?php 

                $query = "SELECT * FROM users WHERE email='xxxxx@xxx.com'";
                $result = mysql_query($query);
                $row = mysql_fetch_row($result);
                echo "$row[2]";

            ?>
        </div>    

    </body>
</html>

和updatebalance.php代码：

<?php
    include_once 'login.php';    
    $db_server = mysql_connect($db_hostname, $db_username, $db_password);
    $emailid = $_POST['emailid']; 
    mysql_select_db($db_database);
    $query = "UPDATE users SET balance= balance +10 WHERE email='$emailid'";
    $result = mysql_query($query);
    if (!$result)
      echo json_encode(array('error' => 1));
    else
      echo json_encode(array('error' => 0));

?>

Ajax Jquery在Mysql表中更新值并在页面上刷新值

2 个答案: