0 
$("#keywordSearchSubmit").on("click", function()
{
    showOverlay();
    var searchString = $("#search-results-form-query").val();
    var manResult = $.ajax({
        url: "Order?Page=storeSearchKeyword",
        data: "searchString="+searchString,
        async: false
    }).responseText;
    $("#cart-product-list").empty();
    $("#cart-product-list").append(manResult);
    hideOverlay();
});

function showOverlay()
{
//alert('a');
 $("#overlay").css("display","block");
//document.getElementById("overlay").style.display = 'block';
}

function hideOverlay()
{
//alert('b');
$("#overlay").css({"display":"none"});
//document.getElementById("overlay").style.display = 'none';
}

我有上面的 Javascript 以便在执行 ajax 调用时出现覆盖。下面是叠加层的 HTML。

<div id=\"overlay\" style=\"display:none;\">
<div style=\"display:block; margin-left: auto; margin-right: auto; margin-top:15%\" class=\"bubblingG\">
<span id=\"bubblingG_1\"></span><span id=\"bubblingG_2\"></span><span id=\"bubblingG_3\">
</span></div></div>

无论我使用哪种上述 javascript，覆盖都不会显示：

document.getElement... $("#overlay")...

覆盖显示的唯一时间是我添加警报框时。一旦我在警报框中单击“确定”，就会出现叠加层。

我试过了：

$("#overlay").trigger("create");

但没有成功。我知道我可以使用 jQuery start 和 complete 而不是调用上面的方法，但它仍然只会在我使用警报时才显示，然后再显示叠加层。

在服务器端处理该请求大约需要 5 秒，因此应该肯定会显示覆盖。

4

1 回答 1

0

我猜它与同步 AJAX 调用有关（参见关于 AJAX 设置的 jQuery 文档）。我会尝试将您的代码修改为

showOverlay();
var searchString = $("#search-results-form-query").val();
$.ajax({
    url: "Order?Page=storeSearchKeyword",
    data: "searchString="+searchString,
    success: function (data, textStatus, jqXHR) {
        var manResult = jqXHR.responseText;
        $("#cart-product-list").empty();
        $("#cart-product-list").append(manResult);
        hideOverlay();
    }
});
于 2013-09-03T02:07:23.950 回答