什么会导致我的 ajax 无法执行所有命令？

Question

我的插入 ajax 代码会刷新页面，但不会发出警报（“添加成功”）。数据确实回显了我仔细检查过的正确的关键触发词 ADD_OK。我没有错误。这对我来说似乎很奇怪，因为我在添加和删除时使用了完全相同的 ajax 代码。

代码不提醒但添加到数据库

<script type="text/javascript"> 
    $(document).on('click','#insert_btn',function (){
      $.ajax({
            type:'POST',
            url:'add.php',
             datatype: "json",
            data: {
                first_name: $("#first_name").val(),
                last_name: $("#last_name").val(),
                position: $("#position").val(),
                date: $("#date").val(),
                updated: $("#updated").val(),
            }, 
            success: function(data){ 
               if (data=='ADD_OK') {
                  //  alert(data);  
                  location.reload();
                      alert("Add Successful");
                } else {
                     //alert('something wrong');
                }
                  }
             })
        }); 
</script>

代码同时执行删除和警报 相同的删除代码将刷新页面和警报（“删除成功”）。什么会导致这种情况？

<script type="text/javascript"> 
    $(document).on('click','.delete_btn',function (){
        if (confirm('Are you sure you want to delete this?')) {
        var id = $(this).attr("id").match(/\d+/)[0];
        var del_id = $('#example').DataTable().row( id ).data();
        var del_id = del_id[0];
        $.ajax({
            type:'POST',
            url:'delete.php',
            data: {del_id:del_id}, 
            success: function(data){ 
                if (data=='DEL_OK') {
                  location.reload();
                  alert("Delete Successful!");
                } else {
                 //    alert('something wrong');
                }
                  }
                     });
        }
        });
</script>

添加.php代码

<?php
$first_name = strtoupper($_POST['first_name']);
$last_name = strtoupper($_POST['last_name']);
$position = strtoupper($_POST['position']);
$date = $_POST['date'];
$updated = $_POST['updated'];  
   $stmt = $conn->prepare("INSERT INTO employees (first_name, last_name, position, date, updated) VALUES (?, ?, ?, ?, ?)");
   $stmt->bind_param('sssss', $first_name, $last_name, $position, $date, $updated);
   $add = $stmt->execute();

    //print_r($_POST);

   if($add) {
      echo "ADD_OK";
   }
  ?>

Answer 1

交换你的 location.reload() 和 alert(...) 行。

仅当页面尚未开始重新加载时才会运行警报。我想由于多种原因，某些页面需要更长的时间。

Answer 2

我添加了插入数据的代码，请尝试检查一下。此外，您尝试这样做来删除和更改您的代码。

<script type="text/javascript"> 
    $(document).on('click','#insert_btn',function (){
      $.ajax({
            type:'POST',
            url:'add.php',
             datatype: "json",
            data: {
                first_name: $("#first_name").val(),
                last_name: $("#last_name").val(),
                position: $("#position").val(),
                date: $("#date").val(),
                updated: $("#updated").val(),
            }, 
            success: function(data){ 
               if (data.success == true) {
                  //  alert(data);  
                  alert("Add Successful");
                  location.reload();
                } else {
                    alert('something wrong');
                }
                  }
             })
        }); 
</script>