如果未正确加载，则隐藏iframe

Hide iframes if not correctly loaded

本文关键字：隐藏 iframe 加载 如果      更新时间：2024-01-15

我的页面上有几个指向外部网站的iframe。如果这些服务被中断或更改，我希望隐藏这些iframe，而不是在我的页面上显示错误消息。有没有办法在Javascript中找到iframe是否已正确加载？我添加了一个类来隐藏iframe，然后在iframe准备好后用jQuery将其删除，如下所示：

$('#widget').ready(function () {
    $('#widget').removeClass('hidden');
});

当我在iframe-src中放入一个无效的URL时，它仍然会删除隐藏的类，显示错误iframe。我的问题有两个：

  • 如果已正确加载iframe，如何使函数运行
  • 我不想使用$（'#widget'）.ready，而是希望使用$（'iframe'）.read一次针对所有iframe；如果我这样做，如何引用函数内部加载的特定iframe

谢谢！

您的问题可以归结为：

如何通过Javascript检查URL是否存在以及网站是否处于活动状态？

答案分为：

  • 对于内部URL，请使用AJAX并检查响应代码：如果是2xx或3xx（例如200或302），则可以。如果是4xx或5xx（例如404或500），那就不好了。阅读更多类似答案。

  • 对于外部URL，由于一种称为同源策略的安全措施，您无法执行此操作。

既然你似乎指向了外部URL，这里是我的建议：

创建一个为您执行检查的服务器端组件（Servlet、RESTful WebService、Struts2操作等……根据您使用的服务器端技术，无论您喜欢什么），并返回带有数据（如果有的话）和HTTP响应代码的流式响应，您可以检查错误。然后从<iframe>调用您的组件URL。

使用Javascript可能无法完全实现您想要的功能，您需要服务器端的东西，例如PHP。



然而，这里有一些有用的地方可以查找更多信息：


您可以使用JQuery函数在iframe加载后运行代码：

$('#myIframe').load(function(){
    //your code (will be called once iframe is done loading)
});

看看这个关于iframe加载的堆栈溢出问题和答案。


要针对函数中的特定元素，请执行以下操作：

$('iframe').aFunction(function() { this.doSomething(); } );

看看这个Stack Overflow问题和关于"this"的答案。

相关文章：