装载程序图像无法在Safari设备上运行

Question

加载程序图像无法在Safari设备上运行 单击搜索按钮，我尝试在重定向到结果页面之前在我的页面上显示加载器。 加载程序映像仅在chrome浏览器上填充，而不是在safari浏览器上填充。只有当我尝试调试此代码或尝试添加警报时，才能在safari浏览器中看到加载程序。 我还尝试通过添加setTimeOut来修复此代码，但它不起作用。

代码更改如下：

function showMainLoader() {
    // **** alert("test");  // Uncommenting this line will show me the loader image
    $('#content').hide();   
    $('#loadingTLoader').show();
    interstitialLoader("#interstitialLoaderStandalone", "Looking for results...", "medium", false); 
}

$(document).ready(function () {
    function validateStandAloneForm() {
        $('#findStandAlone').validate({
            onfocusout: function (element) {
                $(element).valid();
            },
            submitHandler: function (form) {
                $('#loaderT').css("margin-top", "4em");
                $('#loaderT').css("margin-left", "20em");
                showMainLoader();
                return true;
            },
            rules: {
                firstName: {
                    required: true,                 
                },
                lastName: {
                    required: true,
                },
                .
                .
                .
                ......// so on
            }
        });
    }
    $('#findFButtonStandAlone').click(function () {
            validateStandAloneForm();
            var standAloneBRef = $("#findStandAlone").find('#mbsBookingRef').val();
            var standAloneBRefVal = standAloneBRef.replace(/\s+/g, '');

            var standAloneFirstName = $("#findStandAlone").find("#mbsFirstname").val();

            var standAloneFirstNameVal = standAloneFirstName.replace(/[^A-Za-z\x2D\xC0-\xFF\s]+/g,'');

            var standAloneLastName = $("#findStandAlone").find("#mbsLastname").val();

            var standAloneLastNameVal = standAloneLastName.replace(/[^A-Za-z\x2D\xC0-\xFF\s]+/g,'');
            .
            .
            .....// so on
    });
});

function interstitialLoader(a, b, c, d) {
    var e = "<div class='loadingContainer'><span class='aria-hidden' aria-live='assertive' id='LoadingId1' aria-atomic='true'></span>"+
    "   <img src='" + imgPath + "/content/images/sitewide/controls/Interstitial_Spinner.gif'"+
    " class='floatLeft' alt='loader image'/><h2 class='loaderText'>" + b + "</h2></div>"
      , f = "auto";
      /////////////////// Executes only till this.. 
    "small" == c ? (e = "<div class='loadingContainer'><span class='aria-hidden' aria-live='assertive' id='LoadingId_small' "+
    "   aria-atomic='true'></span>"+
    "   <img src='" + imgPath + "/content/Interstitial_Spinner.gif' class='floatLeft' alt='loader image'/>"+
    "   <h2 class='loaderText'>" + b + "</h2></div>",
    f = "455") : 
    "medium" == c ? (e = "<div class='mediumLoaderContainer'>"+
    "   <span class='aria-hidden' aria-live='assertive' id='LoadingId_medium' aria-atomic='true'></span>"+
    "   <img src='" + imgPath + "/content/Extra.jpg' class='promotionalImage' alt='promotional image'/>"+
    "   <img src='" + imgPath + "/content/Interstitial_Spinner.gif' class='floatLeft loadingImage' alt='loader image'/>"+
    "   <h2 class='loaderText'>" + b + "</h2></div>",
    f = "500"),
    $(a).html(e),
    interstitialLoaderReader("#LoadingId_" + c, b);
    .
    .
    .
    ....// so on
    $(".ui-dialog-content").css("width", "100%").css("padding", "0"),
    $(".ui-widget-content").css("background", "#FFFFFF")
}