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（）问题

回答

相关问题