javascript - 所有ajax调用完成后如何刷新页面？

Question

下面是我的 jquery 函数。我需要刷新页面，以便在检查要显示的列后可以显示其他列。目前，使用代码 (location.reload())，它会在 ajax 调用完成之前刷新。我在复选框循环后尝试了 .promise，但它只允许我提交 1 个复选框。

Jquery

$('.delete-numbers').click(function () {
        $('.number-chkbox').each(function () {   
            if (this.checked) {
                $(this).attr('checked', true);
                alert($(this).val() + " " + this.checked + "I GOT INNNN ADDDDD");
                $.ajax({
                    url: '/PhoneBook/AddNumber',
                    data: {
                        Number: $(this).val(),
                        Name: name,
                        PhoneId: PhoneId
                    },
                    type: "POST",
                    dataType: "html",
                    cache: false
                });
            } else {
                $(this).removeAttr('checked');
                alert($(this).val() + " " + this.checked + "I GOT INNNN REMOVE");
                $.ajax({
                    url: '/PhoneBook/AddNumber',
                    data: {
                        Number: $(this).val(),
                        Name: name,
                        PhoneId: PhoneId
                    },
                    type: "POST",
                    dataType: "html",
                    cache: false
                });
            }
        })
        location.reload();
    });

HTML

<div class="modal-body form-group">
                @foreach (var item in Model.PhoneBook.OrderBy(a => a.Number))
                {
                    if (Model.AvailableNumbers.Any())
                    {
                        if (Model.AvailableNumbers.Where(a => a.Number== item.Number).Count() != 0)
                        {
                            <input class="number-chkbox number" type="checkbox" checked="checked" name="@item.Number_Description" value="@item.Number">
                        }
                        else
                        {
                            <input class="number-chkbox number" type="checkbox" name="@item.Number_Description" value="@item.Number">
                        }
                        <label class="non-bold">@String.Format(" {0} - {1}", @item.Number, @item.Number_Description)</label>
                        <br />
                    }
                    else
                    {
                        <input class="number-chkbox number" type="checkbox" name="@item.Number_Description" value="@item.Number">
                        <label class="non-bold">@String.Format(" {0} - {1}", @item.Number, @item.Number_Description)</label>
                        <br />
                    }
                }
            </div>
<div class="modal-footer">
                    <button type="submit" class="btn btn-danger delete-numbers" data-dismiss="modal">Yes</button>
                    <button type="button" class="btn btn-default cancel-number">No</button>
                </div>

Answer 1

$.ajax({
  ...,
  ...,
  success: function() {location.reload();}
})

JQuery AJAX