单击按钮后运行PHP代码但没有刷新页面

Question

我有一个HTML格式的表格，可以将优惠券应用到当前的购物车。 我希望用户只需单击APPLY（输入优惠券代码后），然后不刷新页面，就可以运行一些PHP代码，以便计算相应的折扣。

这是我的表格：

<form action="">
   <input type="text" name="couponCode">
   <input type="submit" value="Apply">
</form>

要运行的PHP：

if (isset($_REQUEST['couponCode']) && $_REQUEST['couponCode']!='') 
{
 $couponCode = $_REQUEST['couponCode'];
    if ($couponCode == "TEST1") 
    {
    $discount=0.2;
    }
}

如何使用javascript完成？

Answer 1

您需要使用表单的onsubmit事件或按钮的onclick事件。

在事件处理程序中，您组装一个URL并“获取”它。 例如：

<script type="text/JavaScript">

function submitCouponCode()
{
    var textbox = document.getElementById("couponCode");
    var url =
        "https://www.example.com/script.php?couponCode=" + encodeURIComponent(textbox.value);

    // get the URL
    http = new XMLHttpRequest(); 
    http.open("GET", url, true);
    http.send(null);

    // prevent form from submitting
    return false;
}

</script>

<form action="" onsubmit="return submitCouponCode();">
   <input type="text" id="couponCode">
   <input type="submit" value="Apply">
</form>

Answer 2

使用jQuery AJAX 。 完成后，根据需要刷新页面。

Answer 3

您可以使用Jquery在PHP脚本上发布AJAX，然后使用JS更改调用页面的内容。

http://api.jquery.com/jQuery.post/

Answer 4

使用jQuery很简单。 你只需要使用正确的标签。 如果您使用“a”标记，页面将刷新。

<button id="MyButton">Click Me!</button>

<script>
  $("#MyButton").click( function(){
    $.post("somefile.php");
  });
</script>