您的位置：首页 > Web前端 > JQuery

2010-12-23 20:09 使用jquery获取iframe加载完成事件

2012-10-29 11:12 465 查看

使用jquery获取iframe加载完成事件

今天在项目中，用ajax去后台去数据列表，然后显示数据列表；同时，把数据中课程总时间和已经学习的时间总时长。把数据给一个iframe，这个iframe中用amcharts 显示矩形图和饼形图。 但是这个iframe一直不刷新。

参考一下的代码，在给iframe的src赋值后，要等iframe的load事件完成后，在做一点小动作就可以了。（给页面的一个隐藏变量赋值。）

转载自： http://www.streamcave.com/article/javascript/201008/jquery_iframe_load.html
网页中的iframe加载完成后，希望做一些工作。比如在iframe内容改变前在某处显示"正在加载"，在加载完成后，显示内容改为"加载完成"。那么该怎么处理呢？

在jquery中iframe加载完成事件为load，而不是ready

<html>

<head>

<meta http-equiv="contentType" content="text/html;charset=utf-8">

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.js"></script>

<script>

$(function(){

$("#phone").change(function(){

$("#message").text("正在加载..");

$("#theone").attr("src",$(this).val());

});

$("#theone").load(function(){

$("#message").text("");

});

});

</script>

</head>

<body>

<select id="phone">

<option value="http://www.google.com.hk/">any one</option>

<option value="http://www.streamcave.com/upload/2010/8/201008251153427683.jpg">htc dream</option>

<option value="http://www.streamcave.com/upload/2010/8/201008251153454306.jpg">htc magic</option>

<option value="http://www.streamcave.com/upload/2010/8/201008251153453524.jpg">htc hero</option>

<option value="http://www.streamcave.com/upload/2010/8/201008251153464400.jpg">htc hattoo</option>

<option value="http://www.streamcave.com/upload/2010/8/201008251153483133.jpg">nexus one</option>

<option value="http://www.streamcave.com/upload/2010/8/201008251153485258.jpg">htc legend</option>

<option value="http://www.streamcave.com/upload/2010/8/201008251153510582.jpg">htc desire</option>

<option value="http://www.streamcave.com/upload/2010/8/201008251153532800.jpg">motorola milestone</option>

</select>

<span id="message" style="color:green"></span>

<hr/>

<iframe id="theone" src="" width="600" height="700"></iframe>

</body>

</html>

#Javascript
内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理 点击这里给我发消息
标签： 
相关文章推荐
新的分享
章节导航