Question

有谁可以告诉我为什么async: false;不允许我的微调器在数据加载期间显示？但是当我使用async: true;时，它会反转我的默认显示切换？

我目前有列表设置了5个不同的项目。其中3个项目设置为在页面加载时默认显示。然后可以单击它们或者可以单击其他2个项目。当我使用async: true;让我的微调器显示时，它就像它不能识别默认的切换。即使在页面加载时选择它们，也不会显示信息。它仅在取消选择后显示。

$(function () {
        var HistoryViewModel;
        var xspinner = new Spinner();
        $.ajax({
            url: '/Users/GetAccountHistory',
            type: 'POST',
            async: false,
            cache: false,
            data: { accountId: @Model.Account.AccountID },
            beforeSend: function () {
                xspinner.showSpinner("Getting History Information...");
            },
            complete: function () {
                xspinner.hide();
            },
            success: function (data) {
                HistoryViewModel = new RCM.ViewModels.History.HistoryViewModel(ko.mapping.fromJS(data));
                ko.applyBindings(HistoryViewModel, document.getElementById('ListPanel'));
                ko.applyBindings(HistoryViewModel, document.getElementById("DetailsPanel"));
                ie9HeightFix();
            },
            error: function (xhr, textStatus, errorThrown) {
                notify.show({ type: 'error', header: 'Error!', content: 'Error fetching History, ' + xhr.statusText });
                return false;
            }
        });
        function ie9HeightFix() {
            if(document.addEventListener && !window.requestAnimationFrame) 
            { 
                var eTop = $('.AccountHx').offset().top; //get the offset top of the element
                var dTop = eTop - $(window).scrollTop(); //position of the ele w.r.t window
                var cHeight = $(window).height() - dTop - $(".colophon").height();
                $(".AccountHx").css("height", cHeight);
                $(".AccountHx").css("position", "relative");
                $(".AccountHx").css("overflow-x", "hidden");
                $(".AccountHx-detailsPanel").css("left", "32rem");
                $(".viewDetailsButton").css("right", "2rem");
            }
        }
        $(window).resize(function() {
            ie9HeightFix();
        });
        $("#vToggle").click();
        $("#pToggle").click();
        $("#sToggle").click();
        $(".search-button").click(function(event){
            $(".subHeader").toggleClass("search-visible");
            $(".AccountHx-items").toggleClass("search-visible");
            $(".search-button").toggleClass("search-visible");
        });
        $(".filter-button, .modal-close").click(function(event){
            $(".AccountHx-filtersPanel").toggleClass("filters-visible");
            $(".filter-birdBeak").toggle();
        });
        $(".filterButtons input").attr("disabled", false);
    });

    $("#vToggle").click(function(){
        $(".js-vItem").toggle();
        $("#vToggle").toggleClass("is-active");
    });
    $("#cToggle").click(function(){
        $(".js-claimItem").toggle();
        $("#cToggle").toggleClass("is-active");
    });
    $("#nToggle").click(function(){
        $(".js-nItem").toggle();
        $("#nToggle").toggleClass("is-active");
    });
    $("#sToggle").click(function(){
        $(".js-sItem").toggle();
        $("#sToggle").toggleClass("is-active");
    });
    $("#pToggle").click(function(){
        $(".js-pItem").toggle();
        $("#pToggle").toggleClass("is-active");
    });
    $("li.filterButton").click(function(){
        $(this).parent().siblings(".clearButton").show();
        $(".AccountHx-filtersPanel .clearButton--all").css('display', 'inline-block');
    });
    $(".clearButton").click(function(){
        var hiddenOption = $(this).siblings(".filterButtons").children(".hiddenOption");
        hiddenOption.siblings('.is-active').removeClass('is-active');
        hiddenOption.toggleClass("is-active");
        $(this).hide();
    });
    $(".AccountHx-filtersPanel .clearButton--all").click(function() {
        $(".AccountHx-filtersPanel .filterButton").removeClass("is-active");
        $(".AccountHx-filtersPanel .hiddenOption").toggleClass("is-active");
        $(".AccountHx-filtersPanel .filterCheckbox").attr('checked', false);
        $(".AccountHx-filtersPanel .clearButton").hide();
        $(this).hide();
    })

Answer 1

我发现的答案是移动 $("#visitToggle").click(); $("#paymentToggle").click(); $("#statementToggle").click();

在以下部分内 success: function (data) {...}

并将async更改为true

为什么异步会在我的javascript中导致问题？

1 个答案: