0

我试过这个答案。

这是我的功能，当我单击图像时调用它。

function CheckOut(urlCheckoutNew,urlWebService) {
  var inputData = JSON.stringify(getQuotation(urlCheckoutNew));
  $('#imgloading').show();
  $.ajax({
    type: 'POST',
    url: urlWebService,
    contentType: 'application/json',
    processData: false,
    dataType: 'json',
    data: inputData,
    success: function (dataQuote) {
        //alert(1);
        $('#imgloading').hide();
    }
  });
}

这是我的html：

<div id="imgloading" style="display:none;">
    <img src="/Content/Images/ImageModal/loading.gif" alt="Confirming"/>
</div>

该功能处于success警报正在工作的状态，但图像未加载。当弹出警报对话框时，我看到加载图像正在后台加载。但是当我评论警报时，图像没有显示。

谁能告诉我我该怎么做？

4

3 回答 3

2

毫无疑问，图像正在加载，它只是再次隐藏得如此之快，以至于它永远不会完全可见。

像这样测试它：

$.ajax({
    type: 'POST',
    url: urlWebService,
    contentType: 'application/json',
    processData: false,
    dataType: 'json',
    data: inputData,
    success: function (dataQuote) {
        $('#imgloading').fadeOut(2000);
    }
});

结果应该是您的图像出现然后慢慢淡出。这可能不是您的预期行为，但它会确认您的图像确实正在加载（因为该alert()方法并不令人信服......）。

您可能希望在短时间内显示图像，以使用户有一种安全感，即确实发生了某些事情。在这种情况下，我建议稍微延迟隐藏图像。有很多方法可以做到这一点，但我通常会执行以下操作：

success: function (dataQuote) {
    var $image = $('#imgloading')
    $image.show(500, $image.fadeOut(2000));
}

由于图像已经显示，因此show()是多余的并且充当简单的延迟。

于 2012-10-19T02:51:08.307 回答
1

尝试

$('#imgloading').html('');

它将删除 html，#imgloading因此图像将消失

你还没有显示图像

<div id="imgloading" style="display:none;">
                              ^^^^^^^^^^^-------its hidden already 

    <img src="/Content/Images/ImageModal/loading.gif" alt="Confirming"/>
</div>
于 2012-10-19T02:51:19.460 回答
1

查看您的代码，您首先显示图像：

$('#imgloading').show();

然后执行 AJAX 请求，成功后隐藏它：

$('#imgloading').hide();

如果图像似乎根本没有显示，则可能存在一些“问题”：

  1. 请求是同步的，因此页面没有机会在两者之间进行更新。

  2. 请求如此之快，以至于图像只显示了很短的时间；您可以将hide()内部包裹起来setTimeout()以延迟隐藏并验证它是否正常工作，尽管您也已经证明了这alert()一点。

  3. 与前文相关的是，当你显示<div>浏览器时，首先会加载图片；根据需要多长时间，当您的请求返回时，它将再次被隐藏。

于 2012-10-19T02:51:37.500 回答