`
jiangzhenghua
  • 浏览: 601084 次
  • 性别: Icon_minigender_1
  • 来自: 北京
社区版块
存档分类
最新评论

如何检测IFRAME中SRC是否可用,不可用将IFRAME隐藏

阅读更多

近期开发的一个项目中需要开发如下一个功能: 需要检测一个iframe中的src是否可用如果不可用则将该iframe隐藏. 我采用的方法是通过ajax去检测,如果不可用才将该iframe隐藏,代码如下: 
<script language="javascript">
var isExistPage = true;
var pageUrl = document.getElementById('frame1').src; //页面地址
var XmlHttp= null;
if(window.XMLHttpRequest){
XmlHttp= new XMLHttpRequest();
}else if(window.ActiveXObject){
XmlHttp= new ActiveXObject("Microsoft.XMLHTTP");
}
try{
XmlHttp.open("GET",pageUrl,false);
XmlHttp.send();
if(XmlHttp.status==200){
isExistPage = true;
}else{
isExistPage = false; } }
catch(error){
isExistPage = false;
} if(isExistPage==false){
document.all.frame1.style.display="none";
}
</script>
其中frame1是iframe的id
使用上述程序你可能会遇到如下问题:

1.页面会报js错误拒绝访问在XmlHttp.open("GET",pageUrl,false);

具体原因如下:ajax是不能够跨域访问的,如果你的iframe的地址与本服务器上的域不一致的话就会导致这种情况.

具体解决办法就是将该地址作为参数传到servlet或者是jsp中进行处理并将处理结果返回给页面.

具体代码修改如下:

<script language="javascript"> 
var isExistPage = true; 
var urlValue = Base64.encode(document.getElementById('frame<c:out value="${aCom.comForm.com_id}"/>').src);//加密该iframe的地址
var pageUrl = "/cetv/kkk.weather?url="+urlValue; //页面地址 
var XmlHttp= null; 
if(window.XMLHttpRequest){
      XmlHttp= new XMLHttpRequest(); 
} else if(window.ActiveXObject){
      XmlHttp= new ActiveXObject("Microsoft.XMLHTTP"); 
  }
      XmlHttp.open("GET",pageUrl,false);
      try{
      XmlHttp.send();
      if(XmlHttp.status==200){
       var str=XmlHttp.responseText;
        if(str==200)
          {
            isExistPage = true;
          }else{
                      isExistPage = false;
                   }
      }else{
      isExistPage = false;
      }
      }catch(error){
      isExistPage = false;
      }
      if(isExistPage==false){
       document.all.div<c:out value="${aCom.comForm.com_id}"/>.style.display="none";
       }

</script>

 servlet中进行处理的代码:

int responseStatus=-1;
     String getUrl = request.getParameter("url");
     getUrl = Base64Util.base64_decode(getUrl);
     if(getUrl.startsWith("/cetv")){
      responseStatus = 200;
     }else{
      HttpClient httpClient = new HttpClient();
      responseStatus = getServerResponseStatus(getUrl,httpClient);
     }
     System.out.println("responseStatus="+responseStatus);
  if(responseStatus == 200)
  {
   System.out.println("该url合法!");
  }
  response.getWriter().println(responseStatus);

这种方式的思路就是通过将跨域地址的ajax请求放在servlet中进行处理并将请求结果responseStatus过 response.getWriter().println(responseStatus);传到页面这样的话页面就可以通过XmlHttp.responseText;

取得这个值.

2.那么为什么要对页面中的url参数进行加密呢,原因就是url本身可以带很多个参数,如果不加密的话url自带的参数就会在servlet中request.getParameter("url");请求中消失,可以将url整体进行加密然后传过来已后再进行解密

分享到:
评论

相关推荐

    IFrame中Session丢失的解决办法

    然而,在IFrame(Inline Frame)环境中,Session的管理变得复杂,因为IFrame本质上是一个嵌入到主页面中的子窗口或框架,它可以加载来自不同源的网页。这种结构可能导致Session信息在IFrame与其父窗口或同一页面中的...

    javascript写的可拖动的iframe

    在本文中,我们将深入探讨如何使用JavaScript实现一个可拖动的iframe。JavaScript是一种强大的客户端脚本语言,常用于网页交互和动态效果的实现。在这个案例中,我们将关注于利用JavaScript来增强iframe的功能,使其...

    iframe 跨域 自动适应高度

    父页面每隔一定时间检测`iframe`的`contentDocument`或`contentWindow`,若可用则获取高度,设置`iframe`高度。这种方法可能因为同源策略而失败,但在某些情况下仍能工作。 - **使用`padding-bottom`技巧** 子...

    CSS防止iframe挂马

    这段代码的作用是当页面加载时,对于每个`&lt;iframe&gt;`元素都会触发`v:expression`中的JavaScript代码,该代码首先将`&lt;iframe&gt;`的`src`属性设为`about:blank`,使其显示为空白页面;然后进一步将其外层HTML设为空字符串...

    网页制作中Iframe自适应高度的解决办法

    `src`属性定义了要嵌入的页面地址,`width`和`height`分别定义了Iframe的宽度和高度,`frameborder`用来设置边框是否显示。 在实际应用中,我们通常希望Iframe的高度能够根据嵌入内容的长度自动调整。这里有两个...

    iframe自适应子页面内容高度

    这段代码首先获取`iframe`元素,然后检查其`contentWindow`和`contentWindow.document`是否可用,如果可用,就设置`iframe`的高度为子页面`document.body.scrollHeight`,这样`iframe`就会根据子页面的实际内容高度...

    comet-iframe.rar

    5. **服务器端数据推送**:当服务器端有新数据可用时,通过PHPComet接口将数据发送到与IFrame相关的连接。这样,即使用户在浏览其他部分的网站,IFrame中的内容也会实时更新。 6. **优化与调试**:根据应用需求,...

    自动改变iframe的高度

    ### 自动改变iframe的高度 在Web开发中,`iframe`是一种常用的技术,...总之,`iframe`自动改变高度是一项实用且重要的技术,对于提升网站的可用性和维护性有着不可忽视的作用。希望本文能为你提供有用的参考和启发。

    IE6 innerHTML写入的iframe src不显示BUG的解决方法

    在IE6浏览器中,开发人员可能会遇到一个特定的问题:使用`innerHTML`属性向DOM元素动态添加包含`iframe`标签的HTML代码时,`iframe`的`src`属性内容不显示。这个问题是由于IE6的一个已知兼容性问题,具体表现为`...

    Iframe 高度自适应浏览器高度

    在父容器上设置相应的样式,可以让Iframe自动填充可用空间。例如,使用Flexbox: ```html ;"&gt; &lt;iframe id="myIframe" src="http://example.com" style="flex: 1;"&gt;&lt;/iframe&gt; ``` 3. **PostMessage API**: ...

    弹出窗口_背景固定_iframe

    在IT行业中,弹出窗口是一种常见的用户界面设计技术,它用于显示额外的信息或者进行特定的操作。"背景固定"和"iframe"是实现弹出窗口功能时可能会涉及到的关键概念。接下来,我们将深入探讨这两个主题以及它们如何...

    Iframe使用帮助

    在实际应用中,Iframe也有一些限制,比如跨域安全策略可能会影响内容的加载和访问,而且对于搜索引擎优化(SEO)不太友好,因为搜索引擎可能无法正确抓取嵌入的内容。然而,通过合理使用和设置,Iframe仍然是构建...

    iframe_自适应高度(简单好用).txt

    2. **条件检查**:首先检查`document.getElementById`是否存在,确保DOM操作可用;然后检查当前`iframe`是否有效且浏览器不是Opera,这是因为Opera的处理机制与其它浏览器有所不同。 3. **高度获取与设置**:通过`...

    JS实现向iframe中表单传值的方法

    总的来说,JS实现向iframe中表单传值是通过获取iframe的`contentWindow`属性,然后操作iframe内页面的DOM元素,将数据传递到隐藏的表单字段,最后提交表单来完成的。这种方法在多页面交互和数据传递中有广泛的应用。...

    bootStarp可视化框架实现拖动iframe

    例如,可以将iframe放入一个`.col`类的div中,然后使用jQuery UI的拖放功能调整其在页面上的位置。 6. **响应式设计**:考虑到移动设备的使用,要确保在不同屏幕尺寸下iframe仍能正常工作。Bootstrap的栅格系统支持...

    iframe高度自适应

    `,然后将`iframe`的`flex-grow`属性设置为1,这样`iframe`会占据所有可用空间。 ```css .parent-container { display: flex; } iframe { flex-grow: 1; } ``` 这样,`iframe`就会根据其内容自动扩展高度。...

    前端项目-set-iframe-height.zip

    在前端开发中,有时我们需要在页面中嵌入`iframe`元素来加载外部资源或实现页面分片。然而,`iframe`的默认行为可能导致内容溢出,用户体验不佳。本项目"前端项目-set-iframe-height"专注于解决这个问题,通过跨域...

    右下角弹出iframe广告代码(可关闭).zip

    实现这种功能通常涉及JavaScript,可能是通过添加一个“关闭”按钮,并设置一个事件监听器来处理点击事件,然后修改`iframe`的`display`样式属性,将其设为`none`,从而达到隐藏的效果。 `使用须知.txt`可能包含了...

    jquery选项 iframe选项卡

    "jquery.benma.tab"这个压缩包文件可能包含了一个名为"benma"的开发者编写的jQuery选项卡插件,特别地,它支持将内容嵌入到iFrame中,这样可以在选项卡之间加载不同的页面或内容。 ### jQuery选项卡基础 jQuery...

    JS修改iframe页面背景颜色的方法

    本文将详细介绍如何使用JavaScript(JS)来修改`iframe`页面的背景颜色。 首先,`iframe`是HTML的一个元素,它允许我们在一个页面中嵌入另一个HTML文档。`iframe`的基本结构如下: ```html &lt;iframe id="myframe" ...

Global site tag (gtag.js) - Google Analytics