Question

我对ajax很新，今天大部分都是。我有几个HTML表格，用户可以在其中更改信息，并且无需重新加载页面即可更新数据库，第一次使用此功能完美...

为了便于解释，我的网址是www.example.com/customers.php?action=viewAll

/************ Update Job Status ************/
$('.update-job-status').on('change', function() {
    var status = $(this).val();
    var id = $(this).parent().children('#id').val();

    var formData = "id="+id+"&status="+status;

    $.ajax({ // Start the PHP submission
                url : "/resources/submit.php?action=updateJobStatus",
                type: "POST",
                data : formData,
                success: function(data, textStatus, jqXHR) {    //data - response from server
                    $('.notification-success').css('display', 'block').append('Status was updated!');
                    $('.notification-success').fadeOut(2000, function(){
                        $(this).empty();
                    });
                }
            });
});

AJAX返回并将我们保持在同一页面（www.example.com/jobs.php?action=viewAll）

现在我尝试调用AJAX在表上执行不同的操作......

/************ Delete Job ************/
$('.delete-job').on('click', function() {
    var id = $(this).parent().children('#id').val();
    var formData = "id="+id;

    $.ajax({ // Start the PHP submission
                url : "/resources/submit.php?action=deleteJob",
                type: "POST",
                data : formData,
                success: function(data, textStatus, jqXHR) {    //data - response from server

                }

            });
});

这里AJAX将我们归还给jobs.php。为什么所有$ _GET参数都被截断？我认为是这种情况，因为网址栏显示.../jobs.php?（它仍然有问号）

有关为什么不维护它的页面的任何想法？

Answer 1

没有button属性的type元素被视为submit内的form元素。正在发生的事情是点击，您的AJAX正在提交，但表单也是如此，因此重新加载您的页面。

一个简单的解决方法是让你的按钮有一个类型，如：

<button type="button" class="delete-job">Delete</button>

Answer 2

如果您的整个页面正在重新加载，则可能是您的＆＃39; delete-job＆＃39;的默认操作。元素正在触发。尝试更改这段代码：

$('.delete-job').on('click', function(e) {

e.preventDefault();

the rest of your code...

这将阻止元素的默认操作执行。

$ .ajax在不需要时重定向

2 个答案: