即使返回 HTTP 200，也不会调用 AJAX 成功函数

Question

当用户点击“立即购买”时，我希望交易发生，并且一旦控制器处理，div 最终会淡出并删除。控制器中的所有内容都按应有的方式工作，但是当我成功将该函数放入时，它不会被调用。但是，当该功能位于成功之外时，它会起作用。此外，window.alert() 在成功时会以某种方式起作用。

这是我的脚本，关于控制器等一切正常

$(document).ready(function(){
            $.ajaxSetup({
                headers: {
                    'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                }
            });
            $('form.buy-product-form').on('submit', (function (e) {
                e.preventDefault();
                var product_id = $(this).attr("id");
                $.ajax({
                    url: $(this).attr('action'),
                    type: 'POST',
                    data: {'id': product_id},
                    dataType: 'json',
                    success: function () {
                        window.alert("THIS ALERT COMMAND WORKS BUT THE FUNCTION DOESN'T!");
                        $(this).closest('.product').fadeOut("normal", function() {
                            $(this).closest('.product').remove();
                        });
                    }
                });
            }));
        });

控制器中的所有内容都可以正常工作，这是它返回的内容：

return response()->json(['ok' => 'ok']);

Answer 1

您不能在success 函数下使用this，因为this 超出范围。只需更改您的代码，如下所示：

 $('form.buy-product-form').on('submit', (function (e) {
                e.preventDefault();
                var product_id = $(this).attr("id");
                var element=this;//getting current element click in  variable    
                $.ajax({
                    url: $(this).attr('action'),
                    type: 'POST',
                    data: {'id': product_id},
                    dataType: 'json',
                    success: function () {
                        window.alert("THIS ALERT COMMAND WORKS BUT THE FUNCTION DOESN'T!");
                        //passing variable
                        $(element).closest('.product').fadeOut("normal", function() {
                            $(element).closest('.product').remove();
                        });
                    }
                });
            }));