jquery加载iframe显示正在加载信息

JQuery

1个成员

jquery加载iframe显示正在加载信息

发表于 2017-01-14 • 3277 次查看

本实例就是利用jquery的一些特性来实现加载iframe时显示正在加载信息，为用户提供了良好了体验。

代码如下

复制代码

<html>
<head>
<meta http-equiv="contentType" content="text/html;charset=utf-8">
<script src="http://code.jquery.com/jquery-1.5.min.js"></script>
<script>
$(function(){

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

    $("#button").click(function(){
        $("#message").text("正在加载..");
        $("#l_iframe").attr("src",http://www.hzhuti.com");
    });

    $("#l_iframe").load(function(){
        $("#message").text("");
  alert("加载完成！");
    });
});
</script>
</head>
<body>
<div id="button">点击这里测试加载</div>
<span id="message" style="color:green"></span>
<hr/>
<div id="description">
<iframe scrolling="auto" height="100%" frameborder="0" width="100%" id="l_iframe" name="l_iframe" src="http://www.rubyonrails.com/" marginwidth="0" marginheight="0"></iframe>
</body>
</html>

查看全部回复倒序查看回复

发表回复

你还没有登录，请先登录或注册！

(大小不能超过2MB，文件类型支持png ,jpg ,gif ,doc ,xls ,txt ,rar ,zip .)