Question

我尝试在div中加载PPT，同时使用replaceWith和谷歌文档：

＆＃13;

$("#u1").click(function() {
  $(".cuerpo").replaceWith('<div class="cuerpo">' + '<iframe src="http://docs.google.com/gview?url=http://**************.pptx&embedded=true" style="width:600px; height:500px;" frameborder="0"> </iframe>' + "</div>");
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

＆＃13;

问题是完全加载需要几秒钟，我需要显示div正在加载的一些消息，无论如何都要这样做吗？

Answer 1

使用jQuery加载的回调方法，如下所示：

$('iframe').load(function(){
   // Iframe has been loaded...Do whatever you want.

});

Answer 2

有人已经回答了类似的问题，结帐How can I create a "Please Wait, Loading..." animation using jQuery?，这可能会帮助您满足您的需求。

Answer 3

您可以添加新的隐藏div，例如：

<div id="loadingDiv" style="display: none; position: fixed; width: 100%; height: 100%; background-color: black; opacity: 0.8><img src="[image here if you want one]></div>

之前

$( ".cuerpo" ).replaceWith( '<div class="cuerpo">' + '<iframe src="http://docs.google.com/gview?url=http://**************.pptx&embedded=true" style="width:600px; height:500px;" frameborder="0"></iframe>' + "</div>" );});

添加一行，例如：$('#loadingDiv').css("display","inherit");

加载内容后，不要忘记再次隐藏它。

......至少有一种方法可以做到。

jQuery - 使用replaceWith时显示加载消息

3 个答案: