如何使用PHP和JavaScript将信息从浏览器发送到数据库

时间:2019-05-27 16:38:26

标签: javascript php html css mysql

我有一个JavaScript函数,每当我单击图像时,我的PHP变量都会增加,单击后,我希望将新信息发送到服务器,并相应地更新数据库本身。

    $Username = $_COOKIE['Dashboardcookie'];
    $host = ~~~~~~~NOTSHOWN;
    $dbUsername = ~~~~~~~~NOTSHOWN;
    $dbPassword = ~~~~~~~~NOTSHOWN;
    $dbName = ~~~~~~~NOTSHOWN;
    $conn = new mysqli($host, $dbUsername, $dbPassword, $dbName);
    $query = 'SELECT Username,Coins,XP FROM timmydinosaur';
    $response = @mysqli_query($conn, $query);
        if ($response) {
            while($row = mysqli_fetch_array($response)) {
                if ($Username == $row['Username']) {
                    $Username = $row['Username'];
                    $Coins = $row['Coins'];
                    $XP = $row['XP'];
                    $FoundUser = true;
                    break;
                }
            }
        }
        echo "<html>
            <head>
                <title>Dashboard</title>
                <link href='https://fonts.googleapis.com/css?family=Orbitron&display=swap' rel='stylesheet'>
            </head>
            <body>
                <center>
                    <h1>Timmy Dinosaur</h1>
                    <img onclick='giveCoin();' src='/timmydinosaur/img/timmydinosaur.png' width='50%' height='75%' />
                </center>
                <div id='container'>
                    <h1>$Username</h1>
                    <h1 id='coins'>Coins: $Coins</h1>
                    <h1>XP: $XP</h1>
                </div>
            </body>
            <script>
                var Coins = $Coins;
                function giveCoin() {
                    Coins++;
                    document.getElementById('coins').innerHTML = 'Coins: '+Coins;
                }
            </script>
            <style>
                body {
                    margin: 0;
                    padding: 0;
                    background-image: linear-gradient(to right, #667db6, #0082c8, #0082c8, #667db6);
                }
                div {
                    position:absolute;
                    top:0;
                    left:10px;
                }

                img {
                    cursor: pointer;
                }

                h1, h2, h3, h4, h5, h6, input, a {
                    font-family: 'Orbitron', sans-serif;
                }
            </style>
        </html>";

我希望每当我单击图像时,信息就会从浏览器发送到数据库。 欢迎任何指导或指向指南的链接。

1 个答案:

答案 0 :(得分:1)

评论中有很多内容,但希望能为您提供帮助。

您需要向我们提供用于更新数据库的代码(php)。

我也是新手,但我认为此伪代码还可以:

  1. 获取计数器变量Coins
  2. 将其存储在会话变量中,如下所示:How to access Session variables and set them in javascript? 。对其进行修改以适合您选择的技术。

通过以下请求发送所需的信息:Making HTTP Requests in JavaScript

  1. 使用PHP代码访问您存储或发送的信息,然后更新数据库。

请将答案标记为正确,如果有帮助,如果您只是问问而需要帮助,我们都是这里的学习者。