精华内容
下载资源
问答
  • iframe嵌套

    2019-06-10 08:05:18
    利用iframe嵌套 所有浏览器都支持 标签。定义和用法 iframe 元素会创建包含另外一个文档的内联框架(即行内框架)。 直接上图 现在我想点击期初商品库存跳到另外一个页面,但是我又想跳转页面在嵌套页面里面跳转,而...

    Js代码

    利用iframe嵌套
    所有浏览器都支持 标签。定义和用法 iframe 元素会创建包含另外一个文档的内联框架(即行内框架)。

    直接上图
    在这里插入图片描述
    现在我想点击期初商品库存跳到另外一个页面,但是我又想跳转页面在嵌套页面里面跳转,而不是直接跳到另外一个页面。

    第一种方法:
    $(document).ready(function () {
    var UserID = $("#divUserID").text().trim();
    //期初商品库存
    $("#CollegeInfor").click(function () {
    KaTeX parse error: Expected 'EOF', got '#' at position 3: ("#̲content").attr(…(document).ready(function ()里面,$(“content”)嵌套页面的ID,attr(获取属性的值)src就是期初商库存页面的路径。

    第二种方法:

    利用src的绑定所以页面的index,让他一个页面嵌套一个iframe
    在这里插入图片描述

    每点击一个嵌套页面,就自增加一然后写上正确的跳转路径。

    效果图:

    在这里插入图片描述

    展开全文
  • 那么如何防止网页被别人的iframe嵌套,防止别人低成本地镜像自己的网站呢?最简单的方法,是使用js在做个前端处理:原理就是判断 window.top 是不是 window.self,如果不是则说明被嵌套了,强制把自己的location替换...
    451beb1173c1eca6b8ec741918b77076.png

    很多人做的网站、博客会被别人用嵌套成为别人的网站,而浏览器可能还会收录这些盗用者的页面,结果自己做的网站反而让别人增加了排名,这是无法接受的。

    那么如何防止网页被别人的iframe嵌套,防止别人低成本地镜像自己的网站呢?最简单的方法,是使用js在做个前端处理:

    原理就是判断 window.top 是不是 window.self,如果不是则说明被嵌套了,强制把自己的location替换到top去,实现反嵌套。核心语句是这个

    if(window.top != window.self)window.top.location = window.self.location;

    但由于方法简单,所以也很容易被人破解。如果别人在引用iframe的时候,是通过document.write('

    document.write('

    所以网上很多文章会建议使用Meta标签加 X-FRAME-OPTIONS 属性,通过浏览器来判断和拒绝被嵌套页面的显示:

    这个仍然是在前端页面里做的,由于其不可靠, X-FRAME-OPTIONS 特性已经逐渐被浏览器弃用了,因此现在也不好使了,但它被保留在了服务器端,通过添加响应头的方法实现避免网页被嵌套,大多数浏览器能支持。

    X-Frame-Options 有三个值:

    DENY

    表示该页面不允许在 frame 中展示,即便是在相同域名的页面中嵌套也不允许。

    SAMEORIGIN

    表示该页面可以在相同域名页面的 frame 中展示。

    ALLOW-FROM uri

    表示该页面可以在指定来源的 frame 中展示。

    方法1:在服务器端,可通过修改web服务的配置来实现,适合所有的静态页面或者动态页面:

    配置 Apache的方法:

    例1:在所有页面上发送 X-Frame-Options 响应头

    Header always append X-Frame-Options SAMEORIGIN

    例2:配置 X-Frame-Options 设置成拒绝

    Header set X-Frame-Options "deny"

    例3:配置 X-Frame-Options 设置成 allow-from

    Header set X-Frame-Options "allow-from https://example.com/"

    配置 nginx的方法:

    add_header X-Frame-Options SAMEORIGIN always;

    方法2:在服务器端,也可以通过设置后端语言的http响应头来实现:

    php

    header('X-Frame-Options:Deny');

    asp

    Response.AddHeader("X-Frame-Options
    展开全文
  • 防止 Iframe 嵌套

    2017-12-12 15:06:00
    X-Frame-Options: 全站禁止Iframe嵌套 X-Frame-Options: DENY(禁止被Iframe嵌套) X-Frame-Options: SAMEORIGIN(只允许同域名中被Iframe嵌套,二级域名不一致也不可以) X-Frame-Options: ALLO...

    X-Frame-Options:

    全站禁止Iframe嵌套

    X-Frame-Options: DENY(禁止被Iframe嵌套)
    X-Frame-Options: SAMEORIGIN(只允许同域名中被Iframe嵌套,二级域名不一致也不可以)
    X-Frame-Options: ALLOW-FROM https://example.com/(可能存在浏览器兼容问题)

    说明文档:

    https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/X-Frame-Options

     

    Content-Security-Policy:(CSP)

    为了弥补上述 ALLOW-FROM 的问题,实现只允许被特定域名Iframe嵌套:

    Examples:

      application.Context.Response.AddHeader("Content-Security-Policy", "frame-ancestors https://*.mozilla.org http://localhost");

    说明文档:

    https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Content-Security-Policy/frame-ancestors

     

    转载于:https://my.oschina.net/u/3706577/blog/1588494

    展开全文
  • iframe嵌套百度地图

    2020-10-20 17:52:51
    iframe嵌套百度地图

    嵌套效果:
    在这里插入图片描述
    注意:iframe的src属性填写的不是url,而是项目中的html文件,以下是html文件代码,获取选中的坐标,只需要拿到iframe对象,调用this.getXY()方法 (其他页面调用iframe.contentWindow.getXY()),

    
    <html>
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>3D地图展示</title>
    <script type="text/javascript" src="http://api.map.baidu.com/api?v=1.2"></script>
    
    <style type="text/css">
    input.btn {
    	border: 1px solid #656565;
    	width: 50px;
    	height: 22px;
    	text-align: center;
    	vertical-align: middle;
    	line-height: 20px;
    	background-image: ;
    	background-position: 0 0;
    	background-color: #F8F8F6;
    	letter-spacing: 4px;
    	background-repeat: no-repeat;
    	background-position: 5px;
    	padding-top: 4px;
    	padding-bottom: 2px; *+
    	padding-top: 2px; *+
    	padding-bottom: 0;
    	margin-bottom:4px;
    	cursor: pointer;
    }
    input.btn:hover {
    	background-color: #B7D6F7;
    }
    input {
    	border: 1px solid #656565;
    	line-height: 20px;
    }
    </style>
    
    
    </head>
    <body style="margin:0;padding:0;width:100%;height:100%;overflow:hidden;" onload="">
    	 <div style='display:block;width:100%;height: 30px;overflow:hidden;border:0;'>
    	  <div style='display:block;height:100%;float:left;border:0;' id="position">
    	   	经纬度:X: <input id="point_x" mdcn="中心X坐标" mdtype="text" bt="text" md="gisp_x"  style="width: 15%;"/>
    	 		 	Y: <input id="point_y" mdcn="中心Y坐标" mdtype="text" bt="text" md="gisp_y"style="width: 15%;" />
    	 		 	地址模糊查询   
             <input id="text_" type="text" value=""style="width: 20%;"/>
             <input class='btn' type="button" value="搜索" onclick="searchByStationName();">
             </div>
         </div>
         <div style="width:100%;height:100%;border:0;overflow:hidden;">
         	<div style="width:100%;height:100%;border:0;" id="container">
         	
         	</div>
         </div>
    </body>
    <script type="text/javascript" >
    
    //var map = new BMap.Map("container", {mapType:BMAP_PERSPECTIVE_MAP});
          var map = new BMap.Map("container"); 
          var point = new BMap.Point(113.934575,22.519486);
          var marker = null;
          var array = new Array();  
          show_Map();
          //当有参数(坐标)传递时,则把地图定位到制定的位置
        // var loca=this.location.search.substring(this.location.search.indexOf("=")+1);
         var loca=getQueryString("site");
         if(loca!="" && loca != null){
          	var location_1=loca.split(",")[0];
          	var location_2=loca.split(",")[1];
            MoveMapShow(location_1,location_2);
            var qwe = document.getElementById("position");
            qwe.style.display="none";
         }
    		function getQueryString(name)
    		{
    		
    			var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)", "i");    	
    			var r = window.location.search.substr(1).match(reg);    	
    			if (r != null) 
    				return unescape(r[2]); 
    			
    			return null;    	    	
    		}
          function show_Map()
          {
              map.setCurrentCity("深圳"); 
              map.setMapType(BMAP_NORMAL_MAP); //设置地图类型为二维地图
              map.centerAndZoom(point,18);
              map.enableScrollWheelZoom();
              map.enableKeyboard();
              map.addControl(new BMap.NavigationControl()); //添加放大镜控件       
              
              var opts = {
    				anchor: BMAP_ANCHOR_TOP_RIGHT,
    				offset: new BMap.Size(70, 20),
    				size: new BMap.Size(100),
    				mapTypes: [BMAP_NORMAL_MAP, BMAP_SATELLITE_MAP]
    			};
      		  map.addControl(new BMap.MapTypeControl(opts)); // 添加图层类型控件		  
                          
              opts = {anchor: BMAP_ANCHOR_BOTTOM_LEFT, offset: new BMap.Size(5,30), size: new BMap.Size(100)};
              map.addControl(new BMap.ScaleControl(opts));                    // 添加比例尺控件
                
              opts = {anchor: BMAP_ANCHOR_BOTTOM_RIGHT, offset: new BMap.Size(5,30), isOpen: true, size: new BMap.Size(230,180)};
      		  map.addControl(new BMap.OverviewMapControl(opts));              //添加缩略地图控件   
          }
    
          map.addEventListener("click",function(e){
             document.getElementById("point_x").value = e.point.lng;
             document.getElementById("point_y").value = e.point.lat;
          });
          
          
          //向select控件添加选项
          function selectOptionAdd(Onselect,sName) 
          {
              var oOption = document.createElement("option");
              oOption.appendChild(document.createTextNode(sName));
              Onselect.appendChild(oOption);
          }
          
          function setMark(Onselect) 
          {
              for(var i = 0; i < array.length; i++)
                  map.removeOverlay(array[array.length - i - 1]);
          
              var searname1 = select1.options[select1.selectedIndex].text;
              var searname2 = Onselect.options[Onselect.selectedIndex].text;
    
          	  var result    =	leapclient.request('getMapMarkData',{
          			parentName: searname1,
          			sonName: searname2
          		});
          	 if (result == null) 
    				return false;
    
       		 for(var i = 0; i < result.length; i++)
       		 {
       		 	addMarker(new BMap.Point(result[i][0],result[i][1]), i, searname2);
       		 }
          }
          
          function removeSelItems(Onselect) 
          {
          	 var result = null;
          	 try
          	 {
          	 	for(var i = 0; i < array.length; i++)
                  map.removeOverlay(array[array.length - i - 1]);
    	          //删除select中所有项
              	select2.options.length = 1;
              	
              	CodeValueShow(Onselect.options[Onselect.selectedIndex].text, select2);
          	 }
          	 finally
          	 {
       	 		result = null;
          	 }
          }
          
          //创建标注
          function addMarker(point ,index, title)
          {
              var myIcon = new BMap.Icon("http://api.map.baidu.com/img/markers.png", new BMap.Size(20,25),
              {
                  offset: new BMap.Size(10,25),
                   
                  imageOffset: new BMap.Size(0,0 - index*25)
              });
              marker = new BMap.Marker(point,{icon: myIcon});
              var label = new BMap.Label(title,{"offset":new BMap.Size(10,-20)});
              marker.setLabel(label);
              map.addOverlay(marker);
              marker.enableDragging();           // 可拖拽
              //marker.setAnimation(BMAP_ANIMATION_BOUNCE); //跳动的动画
              array[array.length] = marker;
          }
          
          function MoveMapShow(x,y)              //显示目标地图
          {
              point = new BMap.Point(x,y);
              map.setCurrentCity("深圳");        
              map.centerAndZoom(point,18);
              map.enableScrollWheelZoom(true);
              
              var title = "";
              var Address_Name = new BMap.Geocoder();
              title = Address_Name.getLocation(new BMap.Point(x,y),function(result)
              {
                if(result)
                    title = result.address;
                     
                for(var i = 0; i < array.length; i++)
                  map.removeOverlay(array[array.length - i - 1]);
                  
                addMarker(new BMap.Point(x,y), 10,title);     
              });
          }
    
        //清空百度版权信息
      	var PP = false;
      	me = this;
      	var t = setInterval(function(){
      		if (PP) return;
      		
      		var docs = document.getElementById("container");
      		if(docs!=null)
      		{
      			for(var i=0;i<docs.all.length;i++)
      			{
      				if(docs.all[i].className==" anchorBL" || docs.all[i].className=="BMap_cpyCtrl anchorBL")
      				{
      					docs.all[i].style.display="none";
      					PP=true;
      					clearInterval(me.t);
      				}				
      			}
      		}
      	},10);	
      	//清空百度版权信息end
    
          
          var localSearch= new BMap.LocalSearch (map, {     
             renderOptions: {     
               pageCapacity: 8,     
               autoViewport: true,     
              selectFirstResult: false     
             }     
           });     
          
          localSearch.enableAutoViewport();   
          function searchByStationName()   
          {   
              var keyword = document.getElementById("text_").value; 
              if(keyword == null || keyword == "")
              {
                alert("请输入查询地址");
                return false;
              }  
              localSearch.setSearchCompleteCallback(function(searchResult){   
              var poi = searchResult.getPoi(0);
              if(poi == null)
              {
                alert("未查到您搜索的地址");
                document.getElementById("text_").value = "";
                document.getElementById("text_").focus();
                return false;
              }
              
              document.getElementById("point_x").value=poi.point.lng;
              document.getElementById("point_y").value=poi.point.lat;
              
              MoveMapShow(poi.point.lng, poi.point.lat); 
              });   
              localSearch.search(keyword);     
          }
          
          function getXY()
          {
          	return document.getElementById("point_x").value+","+document.getElementById("point_y").value;       
          }
          
    
          function getGispPoint() {
        	  //	获取页面中的参数,设置坐标值
    	   	  var qs = location.search.substr(1), // 获取url中"?"符后的字串  
    	   	    args = {}, // 保存参数数据的对象
    	   	    items = qs.length ? qs.split("&") : [], // 取得每一个参数项,
    	   	    item = null,
    	   	    len = items.length;
    	   	 
    	   	  for(var i = 0; i < len; i++) {
    	   	    item = items[i].split("=");
    	   	    var name = decodeURIComponent(item[0]),
    	   	      value = decodeURIComponent(item[1]);
    	   	    if(name) {
    	   	      args[name] = value;
    	   	    }
    	   	  }
    	   	  this.setXY(args.gisp_x,args.gisp_y);
    	  }
          
          function setXY(x,y)
          {
          	MoveMapShow(x,y);
          	document.getElementById("point_x").value = x;
          	document.getElementById("point_y").value = y;      
          }
          
          
          function killErrors() 
          { 
            return true; 
          } 
          window.onerror = killErrors;//捕获JS异常不让其弹出错误框 
    
    </script>
    
    
    </html>
    
    
    展开全文
  • iframe嵌套页面

    2020-02-10 12:59:04
    iframe嵌套页面 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>iframe嵌套页面1</title> </head> <body> <div class="main_page" ...
  • 做项目的时候遇到了iframe嵌套iframe 需要页面高度跟随页面内容多少来显示。而且还不能使用iframe自带的scrolling滚动条。 刚开始就算父iframe高度 计算错误,导致页面显示只显示一半的内容。 解决方法是 : 在...
  • iframe嵌套网站

    2021-02-23 17:30:01
    iframe嵌套网站,显示不出来,求解决办法 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0...
  • iframe嵌套,实现不刷新页面 1. 判断iframe嵌套 使用window.top判断是否嵌套 window.self === window.top // true 表示 没有嵌套 // false 表示嵌套 2. iframe嵌套,,不刷新 ...
  • 下午经理让我在客户服务平台创建一个新的路由,把我们之前写的报表工具嵌套进去,之前的是通过ip访问的,讨论了一会决定用神器 iframe,直接嵌套进去,之前也写过,代码这个东西,CV才是精髓,去某度看了一下,随后开始操作...
  • 本文主要介绍了js判断是否在iframe中及防止网页被别站用 iframe嵌套的方法。具有很好的参考价值,下面跟着小编一起来看下吧
  • ios移动端iframe嵌套问题 一、内容超出iframe宽度 在iframe外嵌套一层div,加上样式如下: <div style="width: 100%; height: 90%;-webkit-overflow-scrolling: touch; overflow: auto;"> <iframe align=...
  • 关于 iframe 嵌套 问题

    2019-11-12 20:46:36
    在vue项目中,使用iframe嵌套另一个域名项目下的一个jsp页面,报错 问题为:X-Frame-Options 设置为了SAMEORIGIN。 原理: X-frame-options响应头。赋值有如下三种: (1)DENY:不能被嵌入到任何iframe或...
  • iframe嵌套网页

    2016-11-26 10:59:00
    iframe嵌套的网页放在某一位置,只需在iframe外加个框,改变框的位置即可,如: <!doctype html> <html lang="zh"> <head> <meta charset="UTF-8"> <meta ...
  • 假设有A、B、C和D四个JSP页面,D通过iframe嵌套在C中,C通过iframe嵌套在B中,B通过iframe嵌套在A中。 然后现在在D中编写JavaScript代码跳转页面。 在本页面跳转(D页面所在的iframe中跳转) window.location....
  • iframe嵌套网页告诉自适应 <iframe src="https://10.122.105.21:3333/" name="iframe" class="iframe" frameborder="0" style="overflow: hidden; height: 100%; width: 100%; position: absolute;"></...
  • 出于沙盒安全性考虑,83版本的chrome浏览器默认禁止了iframe嵌套页面,通过a和window.open,localtion.href点击下载, 为了解决这个问题,可以在父页面的iframe中sandbox属性中添加allow-downloads进行解决,请不要...
  • 效果图参考百度效果:百度拾取坐标系统...关键是获取实时坐标点使用百度拾取系统实际开发中碰到的问题如下:1、实现iframe嵌套src="/bdMap.html"title="this is map"style={{ width: "750px", height: "500px", b...
  • iframe 嵌套页面怎么通信 html <iframe src="text.html" frameborder="0" name="ifrLink" id="ifrLink"></iframe> js 调取子页面的方法 document.getElementById("ifrLink").contentWindow....
  • 测试方法:A站全站调用此JS,然后在B站网页IFRAME嵌套A站,浏览B站嵌套页面,即会跳转到A站。
  • metabase截止到0.34.0版本,其仪表盘自带的添加文本框功能默认是不支持iframe嵌套的,我们在原来基础上稍微改造一下即可支持iframe嵌套功能,效果如下图。 代码修改1: 升级react-markdown版本到4.3.1,重新执行...
  • 问题: 在A页面使用iframe嵌套了B页面,B页面中做了权限校验,即登录成功后才可以访问B中的某个页面,如果没有登录,则跳转A登录页面. 过程: 开始在B中尝试使用页面跳转location.href="A登录的页面地址",一直访问失败,且...
  • 在elementUI中使用树形控件和tabs标签页集成展现iframe嵌套跳转页面使用树形控件node-key="id" :props="defaultProps" @node-click="handleNodeClick">使用tabs标签页组件v-for="(item, index) in editableTabs":...
  • elementUI的iframe嵌套跳转页面

    千次阅读 2019-04-18 22:20:26
    在elementUI中使用树形控件和tabs标签页集成展示iframe嵌套跳转页面 使用树形控件 <el-tree style="margin-left: 20px; background-color: #F6F6F6" :data="treeData" node-key="id" :props="defa...
  • 1.iframe 嵌套 父页面获取子页面元素 $("#testIframe").contents().find("#changeBtn") 注意:需要放在$(function(){})函数中,否则获取不到 父页面获取孙子页面元素 $("#testIframe").contents().find("#...
  • 项目中很多时候会遇到需要用 iframe 嵌套页面的情况。有时候会有这样的需求: iframe 嵌套的页面 A ,点击之后要跳到页面 B ,但是同时还需要 A 页面中的某个属性值。 此时可以先把 A 页面的属性值赋值给最外层的...

空空如也

空空如也

1 2 3 4 5 ... 20
收藏数 3,172
精华内容 1,268
关键字:

iframe嵌套