jquery 修改iframe src

author liuqing

 

	$('#username').attr("src","http://www.dangdang.com");

 

 

修改iframe 对应的内容

 

json tree 添加链接格式 "attributes":{"url":"usermanager/add.action"}

添加链接

 

[{   
    "id":1,   
    "text":"Folder1",   
    "iconCls":"icon-save",   
    "children":[{   
        "text":"File1",   
        "checked":true  
    },{   
        "text":"Books",   
        "state":"open",  
        "children":[
        {   
            "text":"PhotoShop",   
            "checked":true , 
            "attributes":{
            	"url":"http://www.dangdang.com"
            }
        }
        
        ]   
    }]   
},{   
    "text":"Languages",   
    "state":"closed",   
    "children":[{   
        "text":"Java" ,
        "attributes":{
            	"url":"http://www.dangdang.com"
            }
    },{   
        "text":"C#"  
    }]   
}]   

 

实现代码

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@taglib prefix="sx" uri="/struts-tags-zk" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<sx:head/>
<script type="text/javascript">
$(function(){
	$('#username').css({height:$(window).height()- 30});
	$('#tt22').tree({   
	    url:'data.json',
	    animate:true,
	    onClick:function(node) {
	    	var url = node.attributes.url;
	    	if (url) {
	    		$('div.datagrid-mask').css({
	    			height:$(window).height(),
	    			display:"block"});
	    		$('div.datagrid-mask-msg').css({
	    			left:$(document.body).outerWidth(true) / 2,
	    			top:$(window).height()/2 - 20,
	    			display:"block"
	    		});
	    		$('#username').attr("src",url);
	    		clear();
	    	}
	    }
	});
});
function clear() {
	//这时使用 load(function{});
	//当加载成功后就动行function() 
	$('#username').load(function(){
		$('div.datagrid-mask').css({display:"none"});
		$('div.datagrid-mask-msg').css({display:"none"});
	});
}

</script>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
</head>
<body>

<div class="datagrid-mask" style="display:none;width:100%"></div>
<div class="datagrid-mask-msg" 
style="font-size:12px;margin:auto;text-align:center;">正在加载</div>

<ul id="tt22"></ul>
<iframe id="username" frameborder="0" src="http://www.baidu.com" 
style="width:100%;height:100%;"></iframe>

</body>
</html>

 

 

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
引用提到,通过使用jQuery可以改变iframesrc属性,例如通过代码$("#mainframe",parent.document.body).attr("src","//www.jb51.net")来改变mainiframesrc属性。提供了一个方法来显示iframe中body元素的内容,可以通过代码$("#testId", document.frames("iframename").document).html()来实现。指出,iframe元素本身并不能自动伸缩,但可以通过使用iframe-container元素来包裹iframe,并设置iframe-container元素的宽度来达到让iframe适应包含块宽度的效果。同时,还可以根据iframe的长宽比来调整iframe-container元素的高度,以保持iframe的比例。<span class="em">1</span><span class="em">2</span><span class="em">3</span> #### 引用[.reference_title] - *1* *2* [解析Jquery取得iframe中元素的几种方法](https://blog.csdn.net/anbinmei9074/article/details/102066844)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v93^chatsearchT3_2"}}] [.reference_item style="max-width: 50%"] - *3* [web响应式布局中iframe自适应的方法](https://download.csdn.net/download/weixin_38718223/13682220)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v93^chatsearchT3_2"}}] [.reference_item style="max-width: 50%"] [ .reference_list ]

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值