javascript - PHP/jQuery 不只在文本输入中更新数据库？

Question

在我的表单中，用户可以使用下面的 Javascript 更改值。但是当他们点击 X2 Bet 时，它不会更新 PHP 中的赌注。例如，如果我输入 1，它就会起作用。如果我单击 X2，它会显示 2，但会在数据库中插入 1。

谢谢。

<form action="./php/bet_process.php" method="POST" class="form betForm">
    <center>
        Balance: <span class="balance"></span> | Total Bets: <span
            class="total"></span> | Total Profit: <span class="profit"></span>
    </center>
    <hr />
    <span id="betResult"></span>
    <p class="field">
        <input type="text" id="bet" class="large" placeholder="Amount"
            name="bet" style="width: 250px;"> <span>
            <button id="x2bet">X2 Bet</button>
        </span>

    </p>
    <p class="field">
        <input id="chance" name="chance" class="large" type="text"
            placeholder="Chance" value="49.5">
    </p>
    <p class="field">
        <input id="pay" name="payout" class="large" type="text"
            placeholder="Payout">
    </p>
    <p class="field">
        <input id="profit" name="profit" class="large" type="text"
            placeholder="Profit">
    </p>
    <p class="field">
        <input type="submit" value="Bet" class="large" style="width: 360px;"
            id="betBtn">
    </p>
</form>

JavaScript:

$('#x2bet').click(function () {
    $('#bet').val(parseFloat($('#bet').val()) * 2);
});


$(document).ready(function(){

  function updateValues() {
    // Grab all the value just incase they're needed.
    var chance = $('#chance').val();
    var bet = $('#bet').val();
    var pay = $('#pay').val();
    var profit = $('#profit').val();

    // Calculate the new payout.
    pay = (100-1)/chance;


    // Calculate the new profit.
    profit = bet*pay-bet;

    // Set the new input values.
    $('#chance').val(chance);
    $('#bet').val(bet);
    $('#pay').val(pay);
    $('#profit').val(profit);
  }


  $('#chance').keyup(updateValues);
  $('#bet').keyup(updateValues);
  $('#pay').keyup(updateValues);
  $('#profit').keyup(updateValues);


});

PHP 代码:

    <?php
include_once('db.php');
session_start();

echo '
<link rel="stylesheet" href="./css/styles.css" type="text/css" />
<script src="./plugins/loader.js" type="text/javascript"></script>
';

$updated_amount_loss = $_POST['bet'];
$updated_amount_win = $_POST['profit'];

    $selectBalance = $db->prepare("SELECT `balance` FROM `users` WHERE `uid` = :uid");

        $selectBalance->execute(array(':uid' => $_SESSION['uid']));

            $balanceRow = $selectBalance->fetch();

                $userBalance = $balanceRow['balance'];

                    if(isset($_POST['bet'], $_POST['chance'], $_POST['payout'], $_POST['profit']) &&
                        $userBalance >= 0 &&
                        $_POST['bet'] >= 0 &&
                        $_POST['bet'] <= $userBalance &&
                        strlen($_SESSION['client']) == 6) {

                            if($_SESSION['roll'] < $_POST['chance']) {

                                    echo '<p class="message valid">You won!  You rolled a ' . $_SESSION['roll'] . ' out of 100.<span class="close">X</span></p>';

                                        $result = 'Win';

                                            if($_POST['bet'] > 0) {

                                                $updateBalanceWin = $db->prepare("UPDATE `users` SET `balance` = `balance` + :balance WHERE `uid` = :uid");
                                                    $updateBalanceWin->execute(array(':uid' => $_SESSION['uid'], ':balance' => $updated_amount_win));
                                                $insertBetWin = $db->prepare("INSERT INTO `bets`(`uid`, `result`, `amount`, `multiplier`, `time`, `roll`, `actual_amount`) 
                                                                                      VALUES (:uid, :result, :amount, :multiplier, :time, :roll, :actual_amount)");
                                                    $insertBetWin->execute(array(

                                                        ':uid'              => $_SESSION['uid'],
                                                        ':result'           => $result,
                                                        ':amount'           => $_POST['bet'],
                                                        ':multiplier'       => $_POST['payout'],
                                                        ':time'             => date("F j, Y, g:i a"),
                                                        ':roll'             => $_SESSION['roll'],
                                                        ':actual_amount'    => $updated_amount_win

                                                        ));

                                    }

                            }

                            else {

                                    echo '<p class="message invalid">You lost! You rolled a ' . $_SESSION['roll'] . ' out of 100.<span class="close">X</span></p>';

                                        $result = 'Loss';

                                            if($_POST['bet'] > 0) {

                                                $updateBalanceLoss = $db->prepare("UPDATE `users` SET `balance` = `balance` - :balance WHERE `uid` = :uid");
                                                    $updateBalanceLoss->execute(array(':uid' => $_SESSION['uid'], ':balance' => $updated_amount_loss));
                                                $insertBetLoss = $db->prepare("INSERT INTO `bets`(`uid`, `result`, `amount`, `multiplier`, `time`, `roll`, `actual_amount`) 
                                                                                      VALUES (:uid, :result, :amount, :multiplier, :time, :roll, :actual_amount)");
                                                    $insertBetLoss->execute(array(

                                                        ':uid'          => $_SESSION['uid'],
                                                        ':result'       => $result,
                                                        ':amount'       => $_POST['bet'],
                                                        ':multiplier'   => $_POST['payout'],
                                                        ':time'         => date("F j, Y, g:i a"),
                                                        ':roll'         => $_SESSION['roll'],
                                                        ':actual_amount'    => $updated_amount_loss

                                                        ));

                                    }


                            }

                        $_SESSION['roll'] = rand(0, 10000)/100;
                        $_SESSION['client'] = rand(100000, 999999);
                        $secret = 123;
                        $_SESSION['server'] = hash('sha512', $_SESSION['roll'] . $_SESSION['client'] . $secret);

                    }


?>

Answer 1

您的 onclick 方法中缺少 parseInt 和 setter 方法。目前，您只能获取文本框的值并将其相乘。您需要将其放回文本框中，如下所示:

 $('#bet').val(multipliedValue);

你已经吃饱了onclick将如下所示:

 <button id="changeBet" onclick="$('#bet').val(parseInt($('#bet').val())*2);">X2 Bet</button>

但是，onclick 在很多方面都很糟糕:

1. 在 DOM 中很难看。
2. HTML 和 JS 之间没有关注点分离
3. 您需要将其添加到每个 HTML 标记
4. 其中包含多个语句将使 DOM 看起来不可读(对某些人来说)等。

为什么不使用 jQuery 来代替这个呢？

$("#changeBet").click(function() {       
   $('#bet').val(parseInt($('#bet').val())*2);
});

您还可以使用普通的 ol' JS :

var button = document.getElementById("changeBet");
button.onclick = function () {
    var input = document.getElementById("bet")
    input.value *= 2;
}