Question

我有以下代码。

 <html>
     <body>
      <div>
        <iframe> 
          <html>
           <body>
                content
           </body>
         </html>
        </iframe>
      </div>
     </body>
    </html>

我想显示等待光标，直到iframe的内容完全加载。我控制了两个html。

Answer 1

一般来说，当我实现这个时，我用一个带有ajax加载器光标的静态HTML文件填充iframe。然后我使用jquery来更改IFRAME的源（src标签）。然后，最终结果是在浏览器加载下一页时获得加载对话框。

这取决于您对帧代码的实现。如果它只是一个大页面加载并且您在后台加载了javascript，那么最好将图像放在同一页面上，然后在文档“准备好”时简单地隐藏它。使用jquery非常容易。

Answer 2

您可以编写一个简单的函数来更改正文（或其他）的光标：

$('body').css('cursor', 'pointer');

虽然我不确定您是否可以让iframe onload正常运行所有浏览器。

$("#iFrameId").load(function (){
    // do something once the iframe is loaded (disable busy cursor, etc)
});

检查以下SO问题=＆gt; How do I fire an event when a iframe has finished loading in jQuery?

Answer 3

如果您的 iFrame 在页面加载开始时加载，请使用：

$(document).ready(function () {
     $('body').css('cursor', 'wait');
 });

并使用 iframe 的 onload 函数将光标移回：

$('#iFrameID').on('load', function () {
     $('body').css('cursor', 'default');
});

如何在iframe完全加载之前显示忙碌光标？

3 个答案: