为什么我的按钮不使用 ajax 和 jquery 提交表单？答案

【问题标题】：Why does my button dosen't submit the form using ajax and jquery?为什么我的按钮不使用 ajax 和 jquery 提交表单？
【发布时间】：2019-03-16 14:47:12
【问题描述】：

我试图了解为什么我的表单没有提交，但我不知道为什么。我试图 console.log 数组值的值，它工作得很好。

当我点击表单的提交按钮时，它只是显示警报“ok”并重新加载页面，但不提交表单...

<form method="POST">
    <?php 
    while($service = $req->fetch()){ ?>

            <div class="form-control">
              <input type="checkbox" class="getValue" value="<?= $service['price']; ?>">

              <label><?= $service['service']; ?></label>
              <strong><?= $service['price']; ?>€</strong>
            </div>

    <?php } ?>

    <button type="button" name="submit" class="btn btn-warning" id="submit">Submit</button>
   </form>

$(document).ready(function(){
$('#submit').click(function(e){
    e.preventDefault(); // annul action par défaut du button

    var values = [];

    $('.getValue').each(function(){

        if($(this).is(":checked")){ 
            values.push($(this).val()); 
        }
    });

    values = values.toString();

    // PROBLEME HERE:
    $.ajax({
        url:"addServicesRequest.php",
        method:"POST",
        data:{values:values},
        success:function(data){
            alert("ok");
        }
    });
  });
});

提前非常感谢！

【问题讨论】：

仅供参考：e.preventDefault(); 是无用的，因为带有type=button 的按钮没有任何需要阻止的本机行为。但是您是否打开了开发人员的控制台并查看了“控制台”选项卡是否有错误，并查看了“网络”选项卡以查看是否正在发出请求？
我已将其删除，感谢@ScottMarcus 表单仍未提交 :( 这是网络标签：ibb.co/GFyy3ck
尝试删除 e.preventDefault？并且可能将按钮类型设置为提交
@Chris 完成了，但还是不行
@Chris No. 如果你设置按钮类型为submit，那么你需要e.preventDefault()。

标签： javascript jquery

【解决方案1】：

我已经成功了！错误是我放了而不是删除了 e.preventDefault();

【讨论】：