Ajax - 使用 jquery 提交时重新加载页面

Question

我有一个简单的网上商店，我正在尝试添加多个运输选项。 有两个选项，我想将客户选择的选项存储在 session（或 cookie）中。

php 脚本似乎可以自行运行，但会导致页面重新加载，因此我一直在尝试使用 jquery 来实现 ajax 以发送数据重新加载或代码不会运行。

我试图遵循几个答案，包括将button替换为type="submit"但这会导致代码似乎根本没有执行。 在.on中添加'click'会触发代码，但也会导致重新加载。 我检查了控制台，没有发现任何问题。 谢谢你的帮助。

jQuery

$(function(){
   $('#shipping_form').on('submit', function(e){
      e.preventDefault();

      var ship = $('input[name="shipping_val"]').val();
      $.ajax({
         type: 'GET',
         data: { discount: ship },
         success: function(data) {
            //go to next section
         }
      });
      return false;
   });
});

HTML/PHP

<?php
Session_start();
if(isset($_GET['shipping_submit'])){
  $shipping_get = $_GET['shipping_val'];
}else{
  $shipping_get = '3.99';
}
$_SESSION['shipping'] = $shipping_get ;

?>
<html>
<main class="container">


<form method="GET" name="shipping_form" id="shipping_form" action="">
  <p>Please choose your prefered shipping method.</p>
    <input type="radio" name="shipping_val" value="3.99" checked>
    <label for="shipping_val">
      Standard delivery
    </label>
    <input type="radio" name="shipping_val" value="6.99" >
    <label for="shipping_val">
      Express delivery
    </label>

    <button type="submit" id="shipping_submit" name="shipping_submit" >Update</button>
    <?php
    echo '<h1>' . $_SESSION['shipping'] . '</h1>';
    ?>
</form>```

Answer 1

您的问题很可能是您正在使用 AJAX 将数据提交到您从中调用它的同一文件。 您的 ajax 端点（PHP 端）需要是不同的 PHP 文件。

请参阅另一个问题：

在 ajax 响应后未更新值

Ajax - 使用 jquery 提交时重新加载页面

问题描述

1 个解决方案

解决方案1
0 已采纳 2020-04-17 15:04:39

Ajax - 使用 jquery 提交时重新加载页面

问题描述

1 个解决方案

解决方案1 0 已采纳 2020-04-17 15:04:39

解决方案1
0 已采纳 2020-04-17 15:04:39