jQuery AJAX $ .post（）問題

-1

我希望我的頁面從PHP代碼中吐出結果，而不是刷新頁面，但它會將我重定向到頁面。一切似乎都很好，但我顯然錯過了一些東西。

HTML代碼：

<html> 
    <body> 
    <script src="http://code.jquery.com/jquery-1.10.1.min.js" type="text/javascript"> </script> 
    <script src="my_script.js" type="text/javascript"></script> 
     <form action="bet_process.php" method="POST" id="myForm"> 
    <h2 class="title">Betting Settings<span class="line"></span></h2> 
    <div class="form-box"> 
<label for="bet">Bet Amount</label> 
    <input type="text" name="bet" id="bet" class="text" placeholder="Amount"> 
</div> 
<div class="form-box"> 
<label for="pay">Multiplier </label> 
<input type="text" class="text" name="pay" id="pay"> 
</div> 
<div class="form-box last"> 
<label for="profit">Profit </label> 
<input type="text" name="profit" id="profit" class="text" placeholder="Profit"> 
    </div><!-- End Box --> 
<div class="clearfix"></div> 
<div class="form-box"> 
<label for="chance">Win Chance (%)</label><input type="text" name="chance" id="chance" class="text" value="50" placeholder="Win % - 50.5% Default"> 
</div> 

      <p>Slide to choose win chance or enter it in the input!</p><br><input type="range" id="chanceslider" class="vHorizon" step="0.01" min="0.01" max="98" style="background-color: #00aec8; width: 50%;"> 
</div> 





<div class="form-box"> 
    <input type="submit" name="start1" class="button medium color" value="Roll Dice" id="sub"> 
    </div><!-- End Box --> 
<span id="result"></span> 
</div> 


</form> 
</body> 
</html>

PHP代碼：

<?php 

require 'db.php'; 
$uid = $_SESSION['uid']; 
$rand = rand(100, 10000)/100; 
$select_gg_amt = mysql_query("SELECT * FROM `users` WHERE `username` = '$uid'"); 
$select_gg_row = mysql_fetch_array($select_gg_amt); 
$balance = $select_gg_row['balance']; 
$amount1 = $_POST['profit']; 
$amount2 = $_POST['bet']; 
$time_ago = date("F j, Y, g:i a"); 
if(isset($_POST['start1'])) { 

if(isset($_POST['bet'], $_POST['pay'], $_POST['profit'], $_POST['chance'])) { 

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

     if($_POST['bet'] <= $balance) { 

    if($rand < $_POST['chance']) { 

echo '<h3>You rolled a <strong>' .$rand. ' </strong> out of 100 on the percentile dice! You won!</h3>'; 
$result = 'Win'; 

mysql_query("UPDATE `users` SET `balance` = `balance` + '$amount1' WHERE `username` = '$uid'"); 
mysql_query("INSERT INTO `bets`(`amount`, `time_ago`, `username`, `multiplier`, `roll`, `result`) VALUES ('$amount2', '$time_ago', '$uid', '{$_POST['pay']}', '$rand', '$result')"); 

} 

else if($rand > $_POST['chance']) { 
    echo '<h3>You rolled a <strong>' .$rand. '</strong> out of 100 on the percentile dice! You lost...</h3>'; 
    $result = 'Loss'; 
    mysql_query("UPDATE `users` SET `balance` = `balance` - '$amount2' WHERE `username` = '$uid'"); 
    mysql_query("INSERT INTO `bets`(`amount`, `time_ago`, `username`, `multiplier`, `roll`, `result`) VALUES ('$amount2', '$time_ago', '$uid', '{$_POST['pay']}', '$rand', '$result')"); 

} 

} 
else { echo '<h3>You can only bet an amount you\'re capable of paying for!</h3>'; } 
} 
else if($amount2 > 0) { echo '<h3>You need to have a <strong>balance</strong> greater than 0 to bet. Sorry!</h3>'; } 
} 

} 

?>

JavaScript代碼：

$("#sub").click(function() { 
$.post($("#myForm").attr("action"), 
    $("#myForm :input").serializeArray(), 
    function(info){ $("#result").html(info); 
}); 
clearInput(); 
}); 

$("#myForm").submit(function() { 
return false;  
}); 

function clearInput() { 
$("#myForm :input").each(function() { 
    $(this).val(''); 
}); 
}

來源

2013-07-06 Chuck Bartowski

你真的需要正確縮進代碼，否則它幾乎不可讀。

替換爲您的javascript：

$(function() { 
    $("#myForm").on('submit', function(e) { 
     e.preventDefault(); 
     $.ajax({ 
      type: 'POST', 
      url : $(this).attr('action'), 
      data: $(this).serialize() 
     }).done(function(info) { 
      $('#result').html(info); 
     }).fail(function(a,b,c) { 
      console.log('an error occured'); 
      console.log(a); 
      console.log(b); 
      console.log(c); 
     }); 
     $(":input", this).not('#sub').val(''); 
    }); 
});

的提交表單的事件將是合適的事件，並且因爲它的觸發當點擊提交按鈕，你並不需要一個事件處理程序的按鈕。

我添加了一個fail()方法，因爲我們很難測試你的PHP和數據庫的東西，但是如果失敗了，至少你會得到一個錯誤信息？

編輯：

如果這是你的標記，酷似的問題，你缺少的整個頭部部分，以及腳本在主體部分加載。

您至少需要添加HEAD標籤和標題。

來源

2013-07-06 01:41:39 adeneo

對不起，我有點搞砸了格式化它以顯示在計算器上。我應該用該代碼替換整個腳本嗎？ –

是的，問題中的所有內容都可以用上面的JS – adeneo

替換@ChuckBartowski - 實際上，我做了一些修改，現在就試試吧！ – adeneo

jQuery AJAX $ .post（）問題

回答

相關問題