如何使用jquery重新加载iframe?
<html> <head> <script type="text/javascript" src="jquery-1.4.2.js" > </script> <script type="text/javascript"> //Reload Iframe Function </script> </head> <body> <iframe name="f1" id = "f1" src="http://www.google.com.pk/search?q=usa+current+time&ie=utf-8&oe=utf-8&aq=t&client=firefox-a&rlz=1R1GGLL_en" width=500px height=250px> </iframe> <button onClick="abc()"> Reload </button> </body> </html>
解决方法
根据您对Haim帖子的评论,您想要的内容可以简化为:
$('#reload').click(function() { $('#f1').attr('src',$('#f1').attr('src')); return false; });
要么
$('#reload').click(function() { $('#f1')[0].contentWindow.location.reload(true); return false; });
但也许他的答案更适合您的需求.
更新:
我使用上面提供的方法汇总了一个工作示例.我有< iframe>在一个页面中显示另一个打印时间的页面.
< iframe> HTML(time.html):
<html> <head> <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script> </head> <body> The time is now <span id="time"></span>. <script type="text/javascript"> $(document).ready(function() { $('#time').html((new Date()).toString()); }); </script> </body>
和父页面HTML(test.html):
<html> <head> <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script> </head> <body> <iframe id="frame" src="file:///D:/Users/Cory/Desktop/time.html" width="500" height="250"></iframe> <button id="reload">Refresh</button> <script type="text/javascript"> $(document).ready(function() { $('#reload').click(function() { $('#frame').attr('src',$('#frame').attr('src')); return false; }); }); </script> </body>
这在Firefox 3.6和IE 7中对我来说很好用.