javascript - Internet Explorer 在部分更新中呈现整个 View

Question

• ASP.NET MVC 5
• jQuery 1.11.3

对这么长的帖子表示歉意，但我确实需要在正确的方向上插入，因为我只是看不出这里的问题所在。

以下内容适用于 Chrome、Firefox，但不适用于 IE。

正确的结果将如下所示:

但是在 IE 11 中错误的结果如下:

在皮肤下，有一些 JavaScript 通过一些 AJAX 回调对 MVC Controller 进行更新:

//Applies the selected filter from the values selected in the drop down
function ApplyFilter() {
    var brandSelected = $('#filterBrand').val();
    var cruiseLengthSelected = $('#filterCruiseLength').val();
    var departureDateSelected = $('#filterDepartureDate').val();
    var departureFromSelected = $('#filterDepartFrom').val();
    var regionSelected = $('#filterRegion').val();
    var shipSelected = $('#filterShip').val();

    cruisesTemplate.UiBlock('.entire-page');
    cruisesTemplate.UiSetBusy('.entire-page');

    $.ajax({
        url: '/cruises/currentcruiselistfilterset?' +
            'aBrandId=' +
            brandSelected +
            '&aCruiseLength=' +
            cruiseLengthSelected +
            '&aDepartureDate=' +
            departureDateSelected.replace(' ', '_') +
            '&aRegionHierarchyItemId=' +
            regionSelected +
            '&aDepartureFromHierarchyItemId=' +
            departureFromSelected +
            '&aShipId=' +
            shipSelected
    })
        .error(function (xhr, status, error) {
            cruisesTemplate.UiClearBlock('.entire-page');
            cruisesTemplate.UiClearBusy('.entire-page');
        })
        .success(function (data) {
            $.ajax({
                dataType: 'html',
                type: 'GET',
                url: window.location.href
            })
                .error(function (xhr, status, error) {
                    cruisesTemplate.UiClearBlock('.entire-page');
                    cruisesTemplate.UiClearBusy('.entire-page');
                })
                .success(function (data) {
                    $('#results').html(data);

                    //Now refresh the filter bar
                    $.ajax({
                        dataType: 'html',
                        type: 'GET',
                        url: '/cruises/filterbarrefresh'
                    })
                        .error(function (xhr, status, error) {
                            cruisesTemplate.UiClearBlock('.entire-page');
                            cruisesTemplate.UiClearBusy('.entire-page');
                        })
                        .success(function (data) {
                            $('#filter-bar').html(data);
                            cruisesTemplate.UiClearBlock('.entire-page');
                            cruisesTemplate.UiClearBusy('.entire-page');
                        });
                });
        });
}

我唯一能想到的是，这要么是一个计时问题(不太可能)，要么是与 url: window.location.href (更有可能)结合使用的计时问题导致这个问题。

编辑:看起来显然 url: window.location.href 是问题所在，因为在适用的浏览器中我看到以下 AJAX 请求:

https://localhost/cruises/filterbarrefresh https://localhost/departing/australia/cruises https://localhost/cruises/currentcruiselistfilterset?abrandid=8&acruiselength=0&adeparturedate=january_2015&aregionhierarchyitemid=1&adeparturefromhierarchyitemid=73&ashipid=0

而在 IE 中，我只看到此 AJAX 请求(因此，当我们执行完整页面请求时，整个站点会在更新区域内更新:

https://localhost/departing/australia/cruises

我还验证了这不是 jQuery.html() 问题，如 described here 。使用虚拟硬编码字符串或 $("#container").empty().append(data);模式仍然会导致相同的 IE 不良行为。

/编辑:

我的基本问题是:

• 如何在不更改现有 JS 逻辑的情况下在 IE(以及 Chrome、Firefox 等)中实现此功能？
• 我是否错过了 jQuery、Promises 等方面的一些基本知识，以及如何实现这一点，这是不好的做法？

非常感谢所有的指点和建议。

Answer 1

这里的解决方案最终关闭了 jQuery AJAX 调用的缓存，因此:

$.ajax({cache: false;});