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);

                    }


?>

score 2 · Accepted Answer

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

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

你吃饱了onclick会是这样的：

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

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

在 DOM 中很难看。
HTML 和 JS 之间没有分离的关注点
您需要将其添加到每个 HTML 标记中
它里面的多个语句会使 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;
}

score 1 · Accepted Answer

你真的不应该像这样把你的 jQuery 放在你的 HTML 中。它真的很难阅读，并且可能会绊倒一些需要维护此代码的可怜的程序员。

你要做的是调用一个不同的函数来更新值：

<button onclick="someFunc()">X2 Bet</button>

然后在您的 JavaScript 代码中（这意味着在<script>标签中，您将嵌入实际的函数

function someFunc(){
    var theValue = $('#bet').val(); 
    // convert the value into a number
    var theNumber = parseInt( theValue );
    $('#bet').val( theValue * 2 );
}

更好的是，根本不要使用该onclick方法！给你的按钮一个id属性并附加一个点击处理程序：

<button id="x2bet">X2 Bet</button>

// this is exactly the same as "$(document).ready(function(..."
$(function(){
    $("#x2bet").on('click', function(){
        var theValue = $('#bet').val(); 
        // convert the value into a number
        var theNumber = parseInt( theValue );
        $('#bet').val( theValue * 2 );
    });
});

score 1 · Accepted Answer

我可以看到你在那里尝试了一些东西

<button onClick="$('#bet').val()*2;">X2 Bet</button>

但它并没有做你想做的事情，因为在该行中，你没有为 id 的输入分配任何新值bet。这应该可以解决问题：

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

当您使用.val() jQuery函数进行赋值时，您必须将新值作为参数传递。

我还建议将 JavaScript 与 HTML 分开，

<button id="x2bet">X2 Bet</button>

在 JavaScript 中

$('#x2bet').click(function () {
    $(this).val(parseInt($(this).val()) * 2);
});

score 0 · Accepted Answer

还$('#bet').val($('#bet').val()*2);不够吗？您的代码没有任何反应，因为您没有将新值分配回#bet 对象..所以您应该将代码更改为此..

score 0 · Accepted Answer

请记住，type="button"默认情况下您需要其他按钮提交表单，但已经说过您可以使用<button type="button" onClick="$('#bet').val($('#bet').val()*2);">X2 Bet</button>. 最好的做法是为它调用一个函数。

演示在这里

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

5 回答 5

Related

Reference